https://habr.com/ru/articles/778236/

#spa #google #ssr #article #seo

Адаптировал для Реддита и запостил там свою статью Google и Yandex SEO оптимизация для SPA приложений

Как обычно, на таких ресурсах интересны комментарии пользователей.
Первый комментарий - что Bing тоже уже несколько лет хорошо понимает JavaScript
Второй, от false_creek_change, приведу здесь:

Консультант по SEO/a11y на проводе. Не могу передать, сколько раз я сталкивался с SEO-специалистами и/или клиентами, которые клялись, что вам нужен SSR, чтобы поисковые роботы правильно индексировали ваш SPA. Это не так уже почти десять лет. Есть множество гигантских Ecommerce брендов, которые используют SPA уже много лет и имеют чрезвычайно высокие показатели SEO (на ум приходит Walmart). Анекдотично, я лично руководил конверсией сайта .NET MVC Ecommerce со 100 000+ SKU на Vue 2 SPA, и мы действительно увидели улучшение наших SEO-метрических показателей. Это было 8 лет назад.

Мы обычно исходим из следующих соображений:

- Является ли HTML семантическим и доступным (a11y)?
- Предоставляется ли схема через JSON+LD и/или теги?
- Соответствуют ли основные показатели сайта (core web vitals) требованиям?
- Требует ли контент действий пользователя перед загрузкой? Например, если навигация по категориям находится в меню, который по умолчанию скрыт, то такая навигация может не индексироваться. В общем случае, если что-то может быть сделано через SSR, то это же также может быть отображено на стороне клиента и проиндексировано.

Все это Google укажет в Search Console / Lighthouse, чтобы сообщить вам о наличии проблемы.

#seo #spa #google #ssr

Забавный твит

Моя жена только что сказала мне, что сайт по покупке билетов не работает. Оказывается, она просто нажимала кнопку до того, как JS закончил гидратацию, поэтому ничего не происходило 🙈. Спасибо, SSR...

#ssr #nuxt

Еще один известный JS видеоблоггер сравнил SSR и JSX с возвратом к PHP

Вдогонку к этому мему

Maximilian Schwarzmüller - популярный и интересно объясняющий спикер, известен тем, что много лет назад в курсе по Vue 2 заявил, что похоже на то, что React и Angular имели секс, и в результате получился Vue, вобравший в себя лучшие качества обоих.
Сейчас специализируется на React и Next.js.

#jsx #ssr #php #maximilian

Выражение "городить свои велосипеды" в IT заиграло новыми красками

Иногда оно используется по делу, но чаще имеет уничижительную форму, показывающую, что человек вместо популярного, раскрученного решения использует что-то свое или малоизвестное.

Если тебе нужен индексируемый поисковиками сайт, надо писать на Nuxt, а не городить отдельную или динамическую отрисовку. Нужно использовать VueUse, потому что это швейцарский нож в любых ситуациях. Для соединения с бэком надо всегда подключать Tanstack vue-query, потому что у него десятки тысяч звезд на GitHub, все его используют, и он легко решает кучу твоих проблем, о которых ты раньше даже не догадывался, но теперь они у тебя есть. Ну и, конечно, Tailwind!

О VueUse уже много говорилось. Как и об #ssr. Как и о Tailwind.

vue-query образовался из react-query, который действительно решал проблемы Реакта. Но во Vue нет этих проблем. Vue предоставляет все инструменты для эффективной и элегантной работы с бэкендом.

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

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

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

Ну и не будем забывать, что Vue - это тоже велосипед, написанный в эпоху диктатуры Angular, React, JQuery и других солидных, проверенных и общепризнанных решений.

#esse #architecture

Кратко, о чем нам поведал безвременно ушедший

В мире фронтед мета-фреймворков крутятся огромные деньги в виде рекламы, спонсорства и донатов - сотни миллионов долларов. Деньги просто так никто давать не будет. Смысл в том, чтобы втянуть молодых (18-20 лет) разработчиков в работу на этих фреймворках, чтобы потом стричь деньги со стартапов и компаний, которые будут нанимать подобных разработчиков, потому что размещать эти проекты будут на платформах типа Vercel, стоимость хостинга на которой в тысячи раз больше обычного хостинга.

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

При этом огромные деньги тратятся на продажных ютюберов и прочих инфлюенсеров, агрессивно впаривающих тебе эту шнягу из каждого утюга. Убеждающих, что если ты не используешь их "современные технологии", то ты какой-то ущербный. Часто это работает наподобие сетевого маркетинга типа продаж БАДов или продукции Avon.

В частности, следствием этого является, также, многолетняя ложь, что SEO без SSR невозможно, что Web Vitals с ними лучше и прочая маркетинговая ахинея.

Так что Nuxt, ребята, это не про свободу open source-а и лучшие практики.

Лучшие практики - это когда ты как пастушок с дудочкой пасешь коровок на экологически чистых горных альпийских лугах.

А когда специально выведенная генно-модифицированная корова, ни разу не видевшая белого света, обколотая тысячами различных антибиотиков и гормонов, стоит в стойле фермы с вывеской Vercel, с транспортером комбикорма перед носом, транспортером говна позади, и шнырявые разработчики с доильными аппаратами и лопатами для говна переползают от одной к другой, - это, ребята, называется бизнес.

#nuxt #verсel #ssr

Каким же убогим в техническом плане стал сайт Хабра за последние месяцы...

Открываешь страницу, ждешь 3-4 секунды, кликаешь на дропдаун менюшку - иконка поворачивается, а самого меню нет. Ждешь еще, кликаешь - нет, всё сломалось. Надо перегрузить страницу, подождать секунд 7-8 и потом уже кликать, и появится менюшка. И это на быстром интернете.

Как там у вас, SSR-щиков это называется? Гидратация?

Заходишь на страницы личного кабинета - там пусто. Надо нажать F5 и тогда контент появится.

Хабр позорит гордое имя Vue, на котором он частично (комментарии) написан. А писали его, кстати, вроде, завсегдатаи @vuejs_club

#habr #ssr

Всё сущее состоит из противоположных начал, которые, будучи едиными по своей природе, находятся в борьбе друг с другом: день-ночь, горячее-холодное, добро-зло, SPA - бэк API.

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

Поэтому SSR, серверные компоненты и прочие гермафродитные порождения LGBT фронтенда не имеют будущего и обречены на разлагающее зловонное вымирание.

#esse #ssr

Как же раздражает эта тормозная SSR гидратация, когда вроде все появилось на странице, а еще ничего толком не работает.

Такое ощущение, что в последнее время она везде проникла. Особенно, в Google-овские сервисы. Тот самый Google, который всегда пропагандировал мгновенно-отзывчивый интерфейс.

Google sign-in.
Открывается окошко входа, кликаешь кнопку своего аккаунта - хер там. Ждите, товарищ. Чего ждать? Неизвестно. Никаких лоадеров. Просто секунды считай. Кликай время от времени.

Другие в прошлом приличные сайты тоже превращаются в черт знает что.

Самый большой минус фронтендерского SSR - это вот этот отвратительный UX

Ретарды делают ретарды.

#ssr