[Rails] Gem Turbolink 功能與原理
Turbolink 的作用是讓每一個超連結都只用 Ajax 的方式將整個 body 內容替換掉,這樣換頁時就不需要重新載入 head 部份的標籤,包括 JavaScript 和 CSS 等,目的是可以改善換頁時的速度。
Turbolink 原理
Turbolinks 把頁面上所有 a
標籤添加了一個 click 處理函式。如果瀏覽器支援 PushState,Turbolinks 會對頁面發出 Ajax 請求,解析伺服器回過來的響應,把頁面整個 body 用響應回傳的 body 換掉。接著 Turbolinks 會利用 PushState 把 URL 換成正確的,看起來就像重新整理一樣,仍保有漂亮的 URL。
由於 Turbolink 會影響 JavaScript 的 Event Bindings 行為,所以在搭配一些 JavaScript 比較吃重的應用程式,例如使用 JavaScript Framework 如 Backbone、AngularJS、Ember 時會移除不用,以免互相影響。