上個禮拜，我可愛的客戶有個要求，他們要追蹤一個行銷活動的點擊，以前我都是自己直接寫在網站後台，或是用 Google Analytics 的 event 來記錄，但是這次客戶的要求只是一個短暫的行銷促銷點擊紀錄，寫在程式內或是埋 GA event，未來的管理總是一個問題，也很麻煩，所以，我決定使用 Google tag manager，還好，客戶也同意，這樣大家未來都簡單多了，行銷部門也可以更快速，更有彈性的自己建立所需的客戶點擊紀錄。

沒想到，一個簡簡單單的 Google tag manager 安裝，卻讓我吃盡了苦頭，如果各位有看過我寫的 turbolinks 5 介紹：

Rails Turbolinks™ 5 深度研究 — 不管你是愛、還是恨（說得有點超過），但是真的很多 Rails 人乾脆把 Turbolinks 關掉了。 我還是繼續使用中... 什麼是...
Scrivinor 思書: 紅寶鐵軌客

就會知道，Turbolinks 基本上就是將網頁改成 Single Page Application (SPA)，但是，它卻是一個半套的 SPA，如果各位讀者有用過 React 或是其他真正 SPA 開發平台，就會知道，SPA 有一個很重要的關鍵觀念，state，也就是狀態，要談 SPA 可能要再寫一本書，我在這就不深談了，也不是說 半套的 Turbolinks 不好，畢竟，SPA 的開發相當的麻煩，很多網站並不需要 SPA，Turbolinks 提供了一個相當有效率的快速開發方式。

想也知道，如果依照 google tag manager 的建議安裝方式，裝在有 Turbolinks 的網站上，一定不會動，會用到 google tag manager 的網站，基本上都已經是運營中的網站了，相對上，這種運營中的網站，工程師不大能上網討論，還不錯，Rails 最好的就是很棒的開發互助社群，這篇是我能找到，介紹安裝最完整的：How to use Google Tag Manager with Rails and Turbolinks，不幸的是，問題並不完全解決，照著文章改好後，Google tag manager 的 debug console 在點擊連結後，就不見了。

說實話，這是我第一次整合 google tag manager 在 rails / turbolinks 上，這時，我只能盡力去了解問題在那裡，對照文章的介紹，我發現與 google tag manager 標準安裝法中，最大的不同點，就是以下這段：

<script type="text/javascript">
$(document).on('page:change', function(){
  var url = window.location.href;

  dataLayer.push({
    'event':'pageView',
    'virtualUrl': url
  });
});
</script>

看起來不難，但是很多的疑問就出來了，這段程式很簡單，就只是在 turbolinks 將頁面改變後，更改 dataLayer 這個變數，但是，為什麼要在 turbolinks 頁面更新後，要改變 dataLayer 這個變數？除了 pageview 外，其他的 tag 也需要做 dataLayer 變數改變嗎？dataLayer 變數是什麼？為了知道這些，我必須要進一步的深度了解 Google tag manager 的運作方式，這一研究，就是兩天，我慢慢的知道了 dataLayer 在 Google tag manager 的使用方式，只是，google 也沒有再進一步的說明，其他 tag 與 dataLayer 的關係，說實話，我覺得網站上的討論與我自己的研究，都指向必須用逆向工程來解，也就是 hacking 啦，我突然領悟了，這樣做是不對的，因為：

1. google 可以隨時改變程式，所以我的網站穩定度與功能隨時都會消失。
2. 這已經不是第一次我為了用 Turbolinks 而必須做 hacking 的動作。
3. 最後一點，重中之重，我的時間不應該花在這裡。

光這個 google tag manager 的安裝，我就已經花了四天的時間，而且還不知道能不能解決問題，這次更不是第一次，幾乎所有的外部服務或是 open source 的 Javascript 程式，一遇到 turbolinks 都可以說「一定」不會一次就過，都需要改，都需要 hacking， 而且，對我，turbolinks 還有以下的問題：

• 很多情況下，都必須要關掉 turbolinks，但是這真的很討厭，實務上，依來源的不同，你根本就不知道這頁「目前」的 turbolinks 是關掉了沒有，這在開發上，真的很討厭。
• Turbolinks 要求的 Idempotence 實務上，真的很難保證與維持，特別是使用別人開發的程式，現在太多的 Javascript 會修改網頁上的 html/css，不修改，很多動作都很難做到，而這些修改都會考慮網頁前進與後退的行為，可是遇到了 turbolinks 後，基本上沒 hacking 保證都沒辦法用，不信？可以試試 stickUp2，不要忘記裝上後，點前進後退很多次，這樣你才會發現，哇，有 bug！
• 很多人乾脆就在 turbolinks  出問題時，使用 location.reload() 來重讀還原網頁內容，這是個笨方法，因為不只使用者經驗很爛，網頁刷新兩次，更討厭的是，在 iOS 的 safari 上，會讓網頁 scroll 到頂，這是 Safari 的問題，但是使用者體驗是你的問題。
• 更不要提 HTTP caches 對上 Turbolinks caches 的惡夢，很多人不知道 Safari 跟 Firefox 都有一個叫做 “bfcache” (back-forward cache) 的特異功能，會將目前的 DOM 狀態存在記憶體中，當網頁前進後退時，就不用再 HTTP 讀取 server 上的資料了，聽起來跟 turbolinks 有沒有像？所以，使用 turbolinks 時，不要忘記各個瀏覽器都要確實的驗證過，噩夢啊！

這裡還有一個很棒的網站，分享著如何「相容」於 Turbolinks：Turbolinks Compatibility，以前，覺得真好，Rails 的社群真棒，可是現在看起來，卻覺得真可怕，怎麼那麼多要改要 hacking 啊！

要死駱駝的最後一根稻草，就是 google tag manager 了，我決定要跟 Turbolinks 說再見了！

如何拔除 Turbolinks?

網路已經有很多分享了，大家都說得很簡單，但是我實際上拔除時，有很多細節要注意：

1. 移除 turbolinks gem
   1. 網上很多人都說不用，我發現要移除，不然當你做 redirect_to 時，有可能 Turbolinks 還是會將它改成 Turbolinks.clearCache() + Turbolinks.visit()。
   2. 別忘了改後要 bundle install ，再用 bundle show turbolinks 確定移除！
2. application.html.erb 
   1. 移除：<meta name="turbolinks-cache-control" xxx>，這有可能在任何一頁，做個 search 吧！
   2. 移除：'data-turbolinks-track' => true 這部分
      1. <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
      2. <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
3. javascripts/application.js
   1. 移除：//= require turbolinks
4. assets/javascripts/ 中所有的 js 跟 coffee 都要改成：
   1. js: $(document).on('turbolinks:load', function() {  ⇒  $(document).ready( function() {
   2. coffee: jQuery(document).on 'turbolinks:load',  ⇒  $(document).ready
5. 移除 'data-no-turbolink'，data-turbolinks 屬性
   1. 一般都在 link_to，form fields，redirect_to ...
6. Javascript 中：
   1. 改寫任何有 Turbolinks.visit、Turbolinks.clearCache()、Turbolinks.xxx 的程式，

就這樣，我試過應該就能完整的移除 Turbolinks，當然每個人使用 turbolinks 的形況都不一樣，你必須要每一個功能都重新測試，我就發現好幾個地方要重寫 Javascript。

Turbolinks 移除後有壞處嗎？

目前看不到，我原先擔心網站效率會變慢，但是我的客戶說沒感覺，還說好像更快了，因為剛移除，我會繼續追蹤這點，一旦有新的發現，我會在這裡更新，當然有歡迎大家提供心得。

附註：

下面這篇是我所參考的網路討論：「How to disable Turbolinks」，但是我覺得不完整：

How to disable turbolinks in Rails 5? — It's a constant headache when dealing with websockets, and it kills my performance in addition to adding bugs. Since ActionCable is the whole reason I upgraded I'd very much like to get rid of it Stack Overflow