JavaScript

[IT 鐵人賽] Vanilla JS 與 Vue 的生命週期 Day 28

最後幾天來聊一下關於生命週期的事情,這裡提到的生命週期並不限於 Vue 所屬的區域,也包含了一些原生 JavaScript 那種無關 Bug 而是一種 Feature 的那些 生命週期 的事情。 沒有被 JS 婊過就不算寫過 JS 你說是吧( 並沒有這種說法好嗎 ) -------------------------------------------------------------------------------- 關於封裝與執行 我之前犯過幾個低級錯誤,舉個例子給大家看個笑話: 以上是錯誤的範例,至於看不出來哪裡有錯的人 左轉不送謝謝。就字面上來說每個字都對,寫法也沒有錯誤,不過,就

[IT 鐵人賽] 大型資料載入實例與狀況 Deep watch Day 27

昨天看了一些關於大量 DOM 的事情,今天來聊一下關於深度監看的事情。其實在 Vue 裡面,預設的監看並不會看太多,也就是不會看很深。為了效能考量,所以基本上各家前端框架在這件事情上面,或多或少都會留一點餘地。 然後這些餘地有時候會讓人覺得很困擾。 -------------------------------------------------------------------------------- 怎麼監看? 實際上 JavaScript 是可以透過 Proxy [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy] , Reflect [https:

[IT 鐵人賽] 大型資料載入實例與狀況 Large of DOMs Day 26

昨天提到大量資料的事件綁定,今天再來聊一下關於 DOM 這件事情。不知道大家對於 Google Chrome DevTools 熟不熟悉,我們除了用他來看人家原始碼以外,也會使用他來觀察畫面的效能。 推薦大家可以追一下 Paul Irish [https://twitter.com/paul_irish] 的推特。 -------------------------------------------------------------------------------- 關於效能問題 > Advanced performance tooling in Chrome DevTools - Paul Irish @ Velocity 2014

[IT 鐵人賽] 動態載入 webpack 簡易設定 Day 24

今天說好要提到 Webpack 的部分,然後,我最近其實有點疲憊,所以今天就先講一下目前在使用的 Webpack 就好了。 只是說,我可能不會多加解釋就是。 -------------------------------------------------------------------------------- 說好的 Webpack 'use strict' /** * @author Scar Wu, Hina Chen. */ // Load Libraries const path = require('path') const webpack = require('webpack') const webpackLodashPlugin = require(