или это полноценное SPA, SPA в том понятии что мы 1 раз загрузили так скажем "exe'шник" (HTML/CSS/JS файлы) и дальше общаемся только с application-server'ом

понял в чём магия, у тебя действительно совсем иной подход

prerender-server, как ты назвал, или bff, как я его назвал просто проксирует запросы к аппликейшн серверу

так что да, SPA шлет на bff запросы, а не на апп сервер

но шлет запросы, а не перезагружает страницу

так что таки SPA

нее, prerender же запускает headless browser на сервер и рендерит чистый статический HTML который возвращает crawler'ам

смотри, когда я говорю prerender.io я имею в виду конкретное решение, когда prerender — то, что ты в архитектуре из трех частей назвал так

application server - в моём понятии возвращает исключительно данные в JSON формате. никакого AJAX. file server - возвращает само приложение, т.е. "exe'шник" состоящий из HTML / CSS / JS

ну так

в моем тоже

только это

как связан аякс с json?)

вот аппликейшн серверу не похер, как к нему запрос пришел, через аякс или нет?

как связан аякс с json?)

никак)) абсолютно разные подходы в которых AJAX явно проигрывает. чистый JSON API можно к любому клиенту привезать, а AJAX только к браузеру

"спасибо кэп", да, это про меня))

все еще не понимаю, аякс — один из типов запросов, никак не связанный с сервером)

хмм... т.е. в твоей архитектуре prerender server (не prerender.io а свой кастомный) это Proxy если этот proxy получает запрос от клиента - перенаправляет к application server'у а если от crawler'а то рендерит статику и возвращает?

смотри, грубо говоря, флоу такой 1) пользователь идет на страницу /profile/zuldare 2) мой bff получает запрос на /profile/zuldare, он идет на аппликейшн сервер GET /user?nick=zuldare и получает результат 3) он рендерит статическую страничку (exe твой) и отдает ее на клиента 4) клиент уже увидел статическую страничку и нажал "мой профиль" 5) клиент попадает уже js роутером на страницу /profile, данных у него нет, он делает запрос AJAX на bff GET /api/profile 6) bff находит по токену пользователя его ник у себя, идет на апп сервер GET /user?nick=some 7) получает JSON и форвардит его в ответ клиенту, который им уже пользуется

и мне в итоге похер, кроулер это или нет

все клиенты получают страничку БЫСТРО

потому что js не ждут пока скачается (бандлы-то немаленькие у SPA)

и при этом еще и индексация проходит

ох ё-моё, чёт сложновато, тебе не кажется?

это стандарт де-факто в мире реакта)

и это рил быстро работает

и когда один раз так сделаешь, все другие подходы кажутся странными

в мире реакта, верно подмечено)) для меня реакт чужда))

ну и плюс я тебе слишком длинный флоу рассказал чтобы пояснить про прокси

на самом деле можно переставать читать на 3

или это и с Vue реально?

вью так может, nuxt например

ох как не охото ещё один подход изучать.. я уже так к Vue привык, так-что для меня совсем не вариант теперь ещё и реакт изучать

а реакт тут не при чем

его фишка в том что нодой его отрендерить в одну строчку можно

а тебе вон подсказывают что у вью такая либа тоже есть

и вью можно https://github.com/vuejs/vue-hackernews-2.0

сейчас ещё раз пройдусь по пошаговому описанию, самое сложное это "wrapping your head around an idea"

можешь просто попробовать погуглить про SSR

в интернете про это очень много написано

https://github.com/csbun/vue2-ssr-example вот например вроде на той же идее штука, и при этом с vue

в шаге 5) делается AJAX запрос, т.е. сервер возвращает HTML?

нет

на аякс отдается JSON

я привык к правилу что весь HTML качается лишь раз, а любая остальная коммуникация уже исключительно в JSON

если используешь вью то у него целая дока по ssr есть https://ssr.vuejs.org/

у тебя кажется какая-то странная мысль, что аякс не умеет норм запросы делать

fetch('api-resource').then(res => res.json()).then(json => <обработай json и делай че хочешь>)

чем не аякс?

скорее всего у меня просто терминология хромает и я просто неправильно интерпретирую "AJAX"

AJAX = Async Json and XML насколько я знаю

Asynchronous JavaScript and XML

ну почти)

в моей интерпретации AJAX это всегда была технология "нам нужно дорисовать контент, поэтому мы, не перезагружая сайт целиком, просим у сервера отрендерить нам лишь нужную часть HTML'а и вставляем её потом в приложение"

нее

бля))

идея в том, что нам надо дорисовать контент, так что давайте попросим его у сервера, а потом подумаем, как его нарисовать

хммм

а вот в каком формате мы попросим зависит от того, какая моча нам в голову ударила сегодня

можно попросить хтмл, можно джейсон, можно тапком по ебалу

просто суть в том что от сервера мы получаем только JSON и никак не HTML

да получай что хочешь, ты ж сам его пишешь)

что тебе удобнее то и шли

(но советую json, а то загнобят)

ну вот у нас есть со стороны клиента модель которая рендерится в vue-for-each="item in items". items в данном случае и есть модель, которую мы заполняем данными из JSON'а

ннннууу

и в чем вопрос?

теперь если мы рендерим это для crawler'а мы же в случае с prerender.io загружаем это дело всё в headless browser и получаем конечный статик html

возможно ты просто не понял, что это 2 разных сервера, не бэк с апи рендерит html, а отдельный сервер на ноде рендерит vue

проблема только что prerender.io не дожидается асинх. погрузки в модель данных

в конструкторе сервиса или чего там, скоупа короче, где item, ты делаешь let item if( window.item ) item = window.item else fetch(<api-url/bff-proxy-url>).then(res => res.json()).then(json => item = json)

лан кажется рей тоже в теме

так что я пошел про раст читать

а он тебе если че пояснит за сср

ну яж кинул примеры по вью) там все детально описано

ладно ребята, не буду я вас тероризировать своим невежеством)) мне действительно стоит почитать по теме SSR в SPA с использованием Vue

https://ssr.vuejs.org/

вот отсюда начни

👍🏻

даже переведена и актуальна)

спасибо большое