Изобразяване от страна на сървъра спрямо изобразяване от страна на клиента
Ако не сте запознати с правенето на приложения за мрежата и се чудите какво е изобразяване от страна на клиента и изобразяване от страна на сървъра и разликите между двете, тогава тази статия е точно за вас.
Преди да започнем, важно е да запомните, че в миналото интернет се състоеше предимно от статични уебсайтове и многостранични приложения, които изобразяваха HTML, CSS и Javascript главно на сървъра. Дълго време това беше наред, отчасти защото потребителите очакваха статични уеб страници и общата мрежова свързаност не беше толкова производителна, колкото е днес. Интерактивността на уеб страницата беше ниска, тъй като уебсайтовете бяха използвани предимно за показване на съдържание. Това означаваше, че интернетът, рендиран предимно от страна на сървъра, се справя добре. Това се промени с напредването на развитието на съвременните браузъри, тъй като увеличи възможностите на това, което може да се изпълни от клиент на браузър. Нови времена за изпълнение на Javascript, рамки и актуализирани уеб стандарти позволиха на разработчиците да създават приложения в интернет, които се конкурират с приложения на родни платформи. Това доведе до възхода на едностраничните приложения (SPA) като основен метод за доставяне на силно интерактивни уеб приложения. SPA са страхотни и наистина предлагат естествено усещане, с бърза реакция, възможност за ефективно кеширане и могат да бъдат по-лесни за отстраняване на грешки.
Разлики между SSR и CSR
SSR
По време на рендиране от страна на сървъра сървърът изгражда уеб страница, включваща HTML, CSS и съдържание, обикновено без придружаващия JavaScript. Днес JavaScript файловете обикновено са големи и обикновено включват използването на рамки/библиотеки, поради което изпълнението на тези файлове отнема известно време. Междувременно сървърът работи във фонов режим и ще изпрати JavaScript и свързаните с него данни на клиента, след като е готов. Това означава, че потребителите получават светкавично бърз изглед на уеб страница, но тя не е интерактивна, докато не бъдат получени изпълнимите файлове на JavaScript.
Акценти
Първоначалното зареждане на страницата е по-бързо от повечето приложения за изобразяване от страна на клиента, особено на по-стар хардуер и когато потребителите имат лоша/нискоскоростна интернет връзка.
Обичайните трептения на потребителския интерфейс, които се случват с CSR приложения, не се случват толкова често с SSR
Чудесно за SEO, тъй като съдържанието е готово за роботите на търсачките. Предлага и по-лесно управление на SEO. Помислете: добавяне на мета тагове или ключова дума на всяка страница.
Изобразяването от страна на сървъра работи чудесно с текстови сайтове.
Случаи на употреба
Прости сайтове за показване на статично съдържание
Приложения с малки javascript файлове
Обработване на първоначалното изобразяване, когато потребител (или робот на търсачката) направи първата заявка към вашето приложение.
Изобразяване на начална страница или индексна страница, която показва визуална карта или колекция от различни маршрути, които потребителят може да поеме в приложението. Помислете: портал на колежа, показващ опции за прием, оценки, жилища, планове за хранене и т.н.
CSR
Когато клиент направи заявка към приложение, което използва изобразяване от страна на клиента, той получава отговор, състоящ се от обикновен стар HTML файл с минимално съдържание. Включен в този HTML файл обикновено е пакет, който съдържа всички активи, свързани данни и JavaScript файлове, които правят уеб страница видима и интерактивна. Браузърът на клиента ще свърши цялата тежка работа във фонов режим, като прави заявки за зареждане на всички необходими данни и стартиране на файловете, които ще изобразят първоначалния изглед и ще направят приложението интерактивно.
Акценти
Бързо изобразяване на уебсайт след първоначално зареждане
Богати взаимодействия на сайта
Може да използва ефективно кеширане
Стабилна селекция от js библиотеки
Като цяло страхотно за осигуряване на нативно усещане на потребителите за уеб приложение
Случаи на употреба
Първоначална итерация на проекта. CSR обикновено позволява бързо развитие и по-лесно отстраняване на грешки
Възнамерявате да направите версия на мобилно приложение или прогресивно уеб приложение от това CSR уеб приложение
Сървърните ресурси са оскъдни поради липса на средства или невъзможност за мащабиране
Компромиси
Използвайки само изобразяване от страна на сървъра или изобразяване от страна на клиента, вие се сблъсквате с няколко недостатъка. Рендираните от страна на сървъра приложения имат бързо първоначално рендиране, но страницата не е интерактивна, докато не приключи изпълнението на JavaScript или JSX. Ако вашият сайт е много интерактивен, честите заявки към сървъра могат да създадат затруднения и обикновено са скъпи, тъй като вашият сървър върши много работа. Когато става въпрос за изобразяване от страна на клиента, първоначалното зареждане на уеб страница обикновено изисква повече време за зареждане и може да бъде доста тромаво за мобилни устройства. Рендирането от страна на клиента също има тенденция да използва повече външни библиотеки, които може да не са най-добри за сигурност или мащабиране. Най-доброто нещо, което трябва да направите, е да се уверите, че приложението ви е готово и работи, така че ако трябва да използвате рамка за изобразяване от страна на клиента, придържайте се към CSR. Ако създавате сайт за показване на съдържание, тогава изобразяването от страна на сървъра трябва да бъде вашата опция. Сега, ако трябва да използвате и двете, това е възможно с определени рамки, но това е тема за друга публикация. Надяваме се, че това помогна за разбирането на изобразяването от страна на клиента и от страна на сървъра.
