babel簡介
babel是一個js的編譯器，我們平常使用的react、vue等框架都是透過它才能編譯成瀏覽器可以執行的程式碼，個人感覺它是前端這座大廈最最底層並且是最最核心的部分。如果沒有它，前端肯定會退回到刀耕火種時代。
既然是編譯器，所以它肯定會去操作很多的檔案，在babel/core中，它讀取最多的是它的配置包括babelrc、pkgjson、外掛、預設等檔案，所以對操作檔案的結果做快取必不可少！
在js中做快取容器常用的無非就是物件和陣列，babel採用的是es6提供的map，其實就是一個物件，只不過它的key比較隨意（不限於字串）。
好了，現在既然有了快取容器（map），那麼key是什麼呢？用於標記一個檔案，一般可以選擇用檔案的路徑和檔名+檔案內容的md5值，babel用的是前者。
處理檔案的過程可以定義一個handle方法，檔案路徑是handle的一個引數，有時僅僅一個檔案路徑並不能滿足業務邏輯，需要傳入其他的引數，所以handle擁有第二個引數。
在這裡，babel對第二個引數做了一層封裝，把它做成了一個有狀態管理能力的物件CacheConfigurator，所以handle的第二個引數就是這個物件。
handle處理後就會得到對某個檔案本次的處理結果value，現在就把value存入map中嗎？sorry，並不是！
CacheConfigurator是一個擁有狀態管理能力的物件，在handle處理的過程中是可以對它進行狀態修改的。在得到value的值後，還需要去鑑別CacheConfigurator的狀態。
CacheConfigurator有三種狀態：
never，無需快取
forever，需要快取但是下次再處理這個檔案時跳過校驗部分直接返回value
valid，下次再處理這個檔案時需要走校驗邏輯valid
那麼這個校驗邏輯是怎麼傳入的呢？
沒錯，就是handle在處理CacheConfigurator時傳入的。
當下次再去處理這個檔案時，就會優先走快取的邏輯，只有校驗透過才會直接返回value！
整體思路就是這樣，大拿們的想法還是非常精妙的，這個思路在其他業務中也是可以參考的！
babel簡介
babel是一個js的編譯器，我們平常使用的react、vue等框架都是透過它才能編譯成瀏覽器可以執行的程式碼，個人感覺它是前端這座大廈最最底層並且是最最核心的部分。如果沒有它，前端肯定會退回到刀耕火種時代。
既然是編譯器，所以它肯定會去操作很多的檔案，在babel/core中，它讀取最多的是它的配置包括babelrc、pkgjson、外掛、預設等檔案，所以對操作檔案的結果做快取必不可少！
babel的快取機制假設我們現在處理的是一個檔案在js中做快取容器常用的無非就是物件和陣列，babel採用的是es6提供的map，其實就是一個物件，只不過它的key比較隨意（不限於字串）。
好了，現在既然有了快取容器（map），那麼key是什麼呢？用於標記一個檔案，一般可以選擇用檔案的路徑和檔名+檔案內容的md5值，babel用的是前者。
處理檔案的過程可以定義一個handle方法，檔案路徑是handle的一個引數，有時僅僅一個檔案路徑並不能滿足業務邏輯，需要傳入其他的引數，所以handle擁有第二個引數。
在這裡，babel對第二個引數做了一層封裝，把它做成了一個有狀態管理能力的物件CacheConfigurator，所以handle的第二個引數就是這個物件。
handle處理後就會得到對某個檔案本次的處理結果value，現在就把value存入map中嗎？sorry，並不是！
CacheConfigurator是一個擁有狀態管理能力的物件，在handle處理的過程中是可以對它進行狀態修改的。在得到value的值後，還需要去鑑別CacheConfigurator的狀態。
CacheConfigurator有三種狀態：
紅色字型的valid是校驗函式never，無需快取
forever，需要快取但是下次再處理這個檔案時跳過校驗部分直接返回value
valid，下次再處理這個檔案時需要走校驗邏輯valid
那麼這個校驗邏輯是怎麼傳入的呢？
沒錯，就是handle在處理CacheConfigurator時傳入的。
當下次再去處理這個檔案時，就會優先走快取的邏輯，只有校驗透過才會直接返回value！
整體思路就是這樣，大拿們的想法還是非常精妙的，這個思路在其他業務中也是可以參考的！