寫個記錄。
Responsive Web Design (RWD)， 響應式網頁設計
- 是一種網頁設計模式，這種設計可使網站在不同的裝置（從桌面電腦顯示器到行動電話或其他行動裝置）上瀏覽時對應不同解析度皆有適合的呈現，減少使用者進行縮放、平移和捲動等操作行為。
Single Page Application (SPA)，單頁式應用
- 利用 AJAX 非同步的特性跟後端同步資料，將不同的資料動態輸向同一個頁面，達到網頁操作不換頁。
- 缺點: 是少了後端的渲染回傳，如果使用者操作太快，前端就不能保證每次都能得到正確的 Server 資料（eg. 點進網頁內容，還沒加載完成就點各種功能）。
- 需要解決sync與async各項功能的問題
- 典型應用: gmail信箱
Server side render (SSR)，伺服器端渲染
- 為避免 SPA 讓 SEO 變差，先渲染網頁內容，再將後續操作交給 JavaScript，
- 使用者一樣能享受到 SPA 不用換頁的好處，不過首次加載的時間增加了。
- 在 SSR 的開發上也要需要會一點後端技術。(JSP、Thymeleaf等)
Accelerated Mobile Pages (AMP)
- Google帶領開發的開源專案
- 即為「加速行動網頁」，目的是提升行動裝置對網站的存取速度。
- AMP即是透過「規範HTML框架」、「限制JavaScript」、「Google高速緩存」這三種要素，縮小網頁檔案、縮短傳輸時間、降低頁面載入時間。
- 只要透過「行動裝置」搜尋時，發現網址前面顯示一個閃電符號⚡️即屬於AMP網頁，通常優先出現在排序前幾名，甚至讓用戶點擊進去等不到一秒，就能看到網頁內容。不僅提高點擊率，也降低了因網頁載入太久的跳出率。
Progressive Web App (PWA)
- 2016年 Google提出的概念，PWA的存在是為結合網站和 App 二者的特性，透過網站呈現如 APP 般的瀏覽優點，提供更好的用戶體驗。
- 因為PWA的本質是網站，程式語言就是用Html5、Css3、JS。
- 沒有跨平台需要不同程式版本的問題，更新內容也是直接從伺服端更改就可以了。
- 可靠：即時載入，就算網路狀況欠佳，甚至沒有網路的情況下還是能夠瀏覽。
- 快速：畫面流暢且即時回應，提供最佳瀏覽效果。
- 吸引度：使用起來如同App一般，帶來人性化的使用體驗。
- 不需要透過Google Play或是App Store下載，而是在你瀏覽該網站時，會跳出詢問視窗，當使用者按下同意後，會直接在裝置桌面新增一個快速連結的圖示
More info: RWD wiki
More info: AMP wiki
More info: PWA wiki
More info: google AMP
More info: PWA 官網