The UI & Interaction Design Advancement

More JavaScript Component instead of PHP Template Engine

From

To

Be SEO friendly

Prerendering &
Server-Side Rendering

1) SSR in PHP
w/ Node Rendering Command

2) SSR Render Service

3) Dynamic-Rendering Server

https://github.com/UPN-TW/dynamic-rendering-server              

https://developers.google.com/web/updates/2019/02/rendering-on-the-web              

https://www.youtube.com/watch?v=k-A2VfuUROg              

https://www.notion.so/Nuxt-20200121-7406589ffd7a429c845fa67a55d99654

Web vitals / Performance matters

Solve the performance issue

Server-Side Rendering

Through the Request

Server-Side Rendering

Memory leak &

State Pollution

Server-Side Rendering

Cookie Issue

Potential Race Condition

API with set-cookie

Find out API endpoint more easily

Reverse Proxy

Integrate Client & API Server cross testing

leah's Nuxt

chaney's API

Bandwagger Nuxt

Integrate Client & API Server cross testing

node_modules

Nuxt architect is a simple Node.js application

static bundled file

env running Node.js

(just like the traditional way)