Server Side Pre-Rendering mit Vue.js 3
13.02.2023, 00:00 Uhr
Vorgegart
Vue.js-basierte Single-Page-Web-Apps laden zügig, aber durch Vor-Rendern auf dem Server bekommt der Benutzer noch schneller die erste Seite zu Gesicht.
Vue.js in der Version 3.2 hat die dotnetpro ausführlich in [1] zum clientseitigen HTML-Rendering von Vue-js-Komponenten im Webbrowser vorgestellt. Es gibt allerdings auch die Option, das HTML-Rendering derselben Vue.js-Komponenten auf dem Webserver auszuführen [2]. Der Webbrowser erhält dann HTML vom Server, das zunächst statisch ist, dann aber „hydriert“ wird. Dies bezeichnet das Anreichern einer statischen Webanwendung um JavaScript-Code, sodass die Webanwendung dann im Browser interaktiv wird.
Dieses Server Side Pre-Rendering wird oft auch einfach als Server Side Rendering (SSR) bezeichnet. Das Weglassen des „Pre“ stellt aber einen Begriffskonflikt mit Techniken dar, die ausschließlich auf dem Server rendern, zum Beispiel PHP, Java Server Pages und ASP.NET Core. In diesem Beitrag wird daher das „Pre“ nicht fehlen. Eine Webanwendung, die sowohl auf dem Webserver als auch im Webbrowser läuft, wird auch als isomorphisch oder universal bezeichnet. In Angular heißt die entsprechende Technik daher auch Angular Universal [3].
Jetzt 1 Monat kostenlos testen!
Sie wollen zukünftig auch von den Vorteilen eines plus-Abos profitieren? Werden Sie jetzt dotnetpro-plus-Kunde.
- + Digitales Kundenkonto,
- + Zugriff auf das digitale Heft,
- + Zugang zum digitalen Heftarchiv,
- + Auf Wunsch: Weekly Newsletter,
- + Sämtliche Codebeispiele im digitalen Heftarchiv verfügbar
