Как мне преодолеть недостатки одностраничного приложения?

Question

Я хочу создать одностраничное приложение с vue https://vuetifyjs.com/en/ или https://coreui.io/vue/., но в некоторых источниках говорится, что одностраничное приложение плохо работает в SEO. поэтому я подумал об этом. возможно, лучшее решение - это использовать многостраничное приложение. Если это лучший выбор, то какую технологию лучше использовать для разработки многостраничных приложений? API уже доступен, поэтому я просто использую его

. Пожалуйста, предоставьте некоторые из лучших вариантов. поэтому у меня может быть несколько вариантов. спасибо

Answer 1

В то время как другие присоединились к решениям SSR, другой путь, который вы могли бы выбрать, это использовать предварительный рендеринг. prerender-spa-plugin - это плагин веб-пакета, который можно использовать для этого, который берет маршруты, которые вы хотите визуализировать, и генерирует для него файлы HTML и JS.

Существует также Prerender.io , который перехватывает запросы от веб-сканеров и предварительно обрабатывает SPA, прежде чем передать его сканеру. Эта услуга бесплатна до 250 страниц и отнимает у разработчика почти все сложности.

Это может быть фантастическим вариантом, если вы новичок в Vue, не хотите управлять сложностьюрендеринг на стороне сервера, или мы не хотим использовать что-то вроде Nuxt для генерации статического сайта.

Компания, в которой я работаю, использует Nuxt (мы используем универсальный режим, также известный как рендеринг на стороне сервера), но мыМы также очень довольны статическим рендерингом сайта, который он может использовать, используя generate для наших случайных небольших проектов. Просто имейте в виду, что это связано с дополнительной сложностью другого фреймворка, построенного поверх Vue, и множеством дополнительных препятствий, которые сопровождают это.

Answer 2

Правильно, что стандартный VueJS-SPA вреден для SEO, поскольку первый HTML-код обычно доставляется пустым, и только после загрузки и исполнения Vue-кода ваша страница будет динамически отображаться и монтироваться на клиенте.

Создание многостраничных страниц (поскольку каждый маршрут приводит к тому, что сервер отправляет совершенно новую HTML-страницу) с помощью Vue не представляется возможным.

Вместо этого я бы посоветовалпосмотрите на рендеринг на стороне сервера для VueJS. Это может быть достигнуто с помощью стандарта VueJS или с помощью специализированной для этого среды, такой как NuxtJS .

. Эта техника будет эффективно выполнять то, что она будет рендеритьНа первой странице пользователь заходит на сервер и отправляет отрендеренный HTML. Это приведет к хорошему SEO, так как сканер каждый раз получает сотню страниц HTML. Для каждой последующей навигации по страницам сайт будет просто вести себя как SPA.

Answer 3

Общее решение для SEO с SPA состоит в том, чтобы включить серверную визуализацию вашего SPA. Это работает, когда ваш HTTP-сервер обслуживает полностью визуализированное приложение для клиента;вместо того, чтобы отправлять шаблонный HTML, а затем заставлять клиента делать последующие запросы на пакеты приложений и еще много чего.