Renderowanie

Renderowanie – w węższym znaczeniu: przekształcanie przez silnik przeglądarki dokumentu HTML i innych zasobów na wizualną reprezentację wyświetlaną na urządzeniu końcowego użytkownika.

Ostatnia aktualizacja: 02-10-2024
Spis treści

Renderowanie w szerokim znaczeniu

Termin „renderowanie” ma szerokie znaczenie. W tym najbardziej ogólnym oznacz proces generowania zarówno fotorealistycznego jak i niefotorealistycznego obrazu 2D lub 3D za pomocą programu komputerowego. Plik danej „sceny” zawiera ściśle określone informacje na temat żądanego modelu: geometrię, punkt widzenia, tekstury, oświetlenie i cieniowanie. Przykładem takiego rodzaju renderowania jest rotoskoping, w którym, nietypowo, punktem wyjścia, przynajmniej częściowo, jest już gotowy obraz (metodą rotoskopingu posługiwali się m.in. twórcy gry Prince of Persia z 2008 r. oraz filmu Przez ciemne zwierciadło z 2006 r.).

 

W sieci renderowania. Renderowanie w sieci

Renderowanie w Internecie opiera się na prostej zasadzie: pobraniu danych i przekształceniu kodu źródłowego w zaplanowaną wcześniej wizualizację, czyli stronę internetową. Renderowanie umożliwia – zgodnie z przedstawioną powyżej szerszą definicją – przedstawienie elementów graficznych lub interaktywnych zrealizowanych w językach HTML, CSS i JavaScript. To kluczowy element w interakcji serwera z użytkownikiem, dodatkowo umożliwiający poprawną pracę robotów wyszukiwarek internetowych. Proces renderowania prebiega następująco:

pobieranie danych do renderowania,

– przetwarzanie i kompilacja,

wyświetlanie efektu rednerowania.

 

Dlaczego renderowanie jest tak istotne?

Renderowanie ma bardzo duży wpływ na doświadczenie użytkownika (UX), ponieważ wpływa na responsywność i płynność działania witryny na końcowym urządzeniu. Tak samo istotne jest w przypadku wyświetlania dynamicznej zawartości oraz dostosowywaniu strony do konkretnej wyszukiwarki i dominujących obecnie urządzeń mobilnych. To ostatnie m.in. ma wpływ na poprawną indeksację witryny przez roboty Google’a.

 

Rodzaje technologii renderowania

Wraz z rozwojem internetu zmienia się także sposób renderowania stron. Można go jednak zasadniczo podzielić na dwa rodzaje, zależnie od miejsca, w którym przeprowadzany jest opisywany proces.

 

SSR, czyli server-side rendering

Najstarszy sposób renderowania – bo sprawdzający się dobrze w przypadku wyświetlania treści statycznych – stron internetowych, odbywających się na serwerze. W tej sytuacji przeglądarka otrzymuje już wyrenderowany kod HTML. Dobrze wpływa to na czas ładowania strony pozbawionej wielu elementów graficznych.

 

CSR, czyli client-server rendering

Renderowanie (najpierw HTML, CSS, a potem JavaScript) wykonywane jest przez silnik przeglądarki na podstawie danych wysłanych przez serwer. Zaletą tego typu renderowania jest dynamiczna aktualizacja treści bez konieczności przeładowywania całej strony.

 

Renderowanie na „osi czasu”

Na renderowanie można też spojrzeć jako proces odbywający się etapami w określonym czasie: progresywny, statyczny i dynamiczny.

 

Progressive rendering

Sekwencyjne wyświetlanie strony oznacza, iż wybranym elementom do wyświetlenia, przydzielony jest określony priorytet wyświetlania (niski lub wysoki). Dzięki temu można zoptymalizować czas ładowania strony i poprawić UX.

 

Static Site Generation (SSG)

W tym przypadku zawartość strony wysyłana jest w postaci statycznych plików HTML (struktura strony jest już gotowa przed jej wyświetleniem, co sprawia, że ładuje się błyskawicznie). To bardzo dobre rozwiązanie dla witryn niewymagających zaawansowanych funkcji interaktywnych. Strony takie są również bezpiecznie, gdyż z oczywistych względów nie korzystają z baz danych.

 

Renderowanie dynamiczne jako rozwiązanie tymczasowe

W tym przypadku tymczasowość ma znaczenie dosłowne. Renderowanie dynamiczne jest tu formą – by zacytować dokumentację Google – „obejścia problemu” nieprawidłowego wyświetlania kodu HTML bądź ignorowania JavaScript (wykrywając takiego bota, serwer renderowania dynamicznego, wyświetla użytkownikowi wersję bez JavaScript poprzez CSR).

 

Renderowanie – najczęściej zadawane pytania

Na czym polega renderowanie?

Renderowanie w internecie jest procesem przekształcania kodu i danych w postać, którą widzi użytkownik. Może ono odbywać się na serwerze lub po stronie użytkownika.

Jak renderowana jest strona internetowa?

Poszczególne etapy renderowania obejmują: styl, układ, malowanie, a niekiedy także kompozycję. Stworzone tzw. drzewo renderowania używane jest do obliczania układu każdego widocznego elementu witryny wyświetlanego
na ekranie.

Autorzy
  • Roman Książek

    Content SEO Specialist. Absolwent filologii polskiej na Uniwersytecie Śląskim w Katowicach. Doświadczony redaktor i nauczyciel. Laureat X edycji Konkursu im. Krzysztofa Mętraka dla młodych krytyków filmowych. Publikował w pismach ogólnopolskich. Zgodnie ze swoim nazwiskiem lubi książki, zgodnie z imieniem – powieści (der Roman). Uwielbia łąki i uważa koty za wyższą formę istnienia.

Wymieńmy się doświadczeniami
Opowiedz nam o potrzebach twojej firmy, a my z pasją zajmiemy się ich wdrożeniem.

Bartosz Kastelik
Global Chief Sales Officer

Jesteśmy częścią grupy