按下這裡查看新的 Tocas UI 2 文件吧。

老實說這是一個超大工程⋯ 也是替 TeaMeow 前端做熱身的準備，

這次的文件和以往 Tocas UI 1 有所不同的地方在於這次採用了 Vuejs 作為框架，

意思是一旦網頁讀取完畢，其他頁面也就一起讀取完畢了，沒錯！轉跳到其他頁面不需要重新讀取，

對於開發者來說有很多很多好處啊⋯例如元件可以重複使用、統一集中開發，之類的。

有一好當然就沒兩好，對嗎？我肯定這一句，至少是現在，一旦用了 Vuejs 之後確實是省去了每個頁面要讀取的麻煩，

但那代表著你的觀看裝置也需要有足夠的效能，因為是一次就讀取所有的內容，我確定在 LG G4 上是沒有問題的，但那不代表著我老舊的 MTK6582 手機就沒有問題，

為此我在頁面底部增加了一個「本頁渲染速度」用來看電腦和手機上的渲染差異，電腦大約是 100ms 而手機（LG G4）可能來到 400ms 或是 600ms 之間，

我想我會先把這個問題放在「待解決」那邊，然後在真正於 TeaMeow 上實行的時候再來解決這個問題。

順帶一提這次還新增了一個「原始碼」按鈕，先前有人抱怨過網頁太沈長而且沒有「回到頂部」按鈕，這次兩個驚喜一次滿足。

當然問題還不只這些，既然是個開發者部落格我就順便提一下架設這個文件頁面遇到了什麼事情，

 

因為 Vuejs 是客戶端渲染框架，這意味著有個路由器在取決於網址該做什麼，

假設說網址是 /hello/ 在傳統網站上應該是去訪問 hello 資料夾中的檔案，

但客戶端渲染不這麼做，取而代之的是詢問 index.html 來得知如果網址是 /hello/ 應該做什麼動作，

這在 Github Pages 和 Surge 上遇到了一些小問題，那就是他們預設不吃這種方式，

他們會直接告訴你 404 網頁找不到，因為他們會直接去尋找伺服器內有沒有這個檔案，

為了解決這個問題我 Google 到了 Github 的 404 頁面可以自訂，所以我就將 404 頁面的內容直接照抄 index.html，

如此一來就算 404 也會執行 index.html 的內容然後讓路由器能夠照常運作，真是太好了。