先來講講自己今天看的一些文章。

第一篇是【Day 2】React.js介紹 && 第一個 React 程式，內容不多，但重點是這一張圖：

這張圖其實是用來講：atomic design，跟 React 有些差異。atomic design 算是一個方法論，提倡說應該要把 App 切成很多個 level，概念跟 React 提倡的 component 有點像，但重點在於「怎麼切割 component」這件事情。

以 React 來說，它本身並沒有規範 component 應該要怎麼切。舉例來說，你一整個頁面就是一個 component，底下完全不切也可以。但比較常見的做法不會這樣做就是了，會把底下的東西也都切成 component。

而 atomic design 專注的是「component 應該這樣切」，提倡說你的 App 其實就跟大自然（？）一樣，是由最小的原子（atom）構成，然後原子構成分子，分子構成有機物等等之類的。看起來其實滿美好的。

但理論跟實作上總是會有差距的，因為中間還是有一些模糊地帶。我之前維護過一個使用 Atomic React 的專案，那個專案的開發者並沒有把東西切得很好，導致一大堆東西都變成 atom，超級多個 component，一個 project 裡面有六七十個 component，而且滿多其實功能都有點重複。不過我也沒有說這是 atomic 的錯，比較大的原因可能是開發者沒有抓到 atomic design 的精髓，才會導致這種狀況。

特別提出來講只是想跟大家經驗分享一下，有時候看跟做是兩回事，看起來好像都很美好，真的頭洗下去才會發現眉角超級無敵多。

第二篇看的是 Day5 [JavaScript 基礎] Event Loop 機制，剛好之前有幫學生上到這個，也算是小有研究，這邊幫大家多做一些補充。

如果你想理解 event loop，我這邊推薦一個影片：What the heck is the event loop anyway? | Philip Roberts | JSConf EU，講得真的是超級好，我逢人就推薦這個影片。

再來我覺得文中拿 iOS 跟 Android 開發來做比喻挺好的，對有寫過的人來說真的是個很棒的類比。Event loop 跟執行環境有關，Node.js 跟瀏覽器的 Event loop 是不同的，Node.js 的有官方文件跟這篇經典好文：非同步程式碼之霧：Node.js 的事件迴圈與 EventEmitter可以參考，Node.js 底層是用 libuv 來實作的。瀏覽器的話參考原文最後附的參考資料即可。

基本的 event loop 滿好懂的，但有些新手會誤以為只要是 callback 就會被放到 event loop 裡面，例如說：

function run(fn) {
  fn()
}
run(function() {
  console.log(1)
})
console.log(2)

請問最後印出來的會是什麼？12 還是 21？

如果你學到 event loop 之後就得意忘形，可能會以為是 21，但正確結果是 12。因為上面這題跟 event loop 一點關係都沒有，event loop 是拿來處理「非同步」的問題，上面是同步的，不會有這個問題。在瀏覽器上最常見的非同步行為就是 setTimeout 以及 ajax。

我自己覺得對 event loop 有兩層理解，第一層就是上面講過的那些基本，知道有 event loop 這個東西，知道 setTimeout 為什麼是這樣；而第二層理解就是 mirco task 跟 marco task。這邊才真的能測出你對 event loop 的理解是否有深度。

我先投降，投降輸一半，這邊我還沒有澈底理解過，我覺得想要理解的話需要花一段時間，做一堆實驗來佐證。等有朝一日我自認懂了再來跟大家分享。

最後補充一個小地方，那就是 Node.js 裡面才有的 nextTick，其實 Vue 有自己實作了一個：vue/src/core/util/next-tick.js，底層依序是使用了 Promise、 MutationObserver、setImmediate、setTimeout 這些東西，根據平台的支援度來決定要用哪一個。程式碼滿短的，註解居多，都是在解決一些 edge case，推薦大家可以看看。

接著來介紹今天發現的兩個新系列的文章。

[駭客工具 Day5] 負載平衡偵測 - lbd 這裡面有介紹到一些工具，我覺得就算不是駭客，有些工具也挺好用的。例如說裡面介紹到的 wireshark，雖然我沒什麼用過，但小時候用過類似的 wpe pro 來改遊戲封包，還滿有趣的。

上面貼的這篇介紹到的 lbd 是第一次聽到，覺得好奇偵測方式就直接跑去找原始碼：https://github.com/craig/ge.mine.nu/blob/master/lbd/lbd.sh

都是 CLI 指令的集合，看得沒有很懂，但應該是透過以下幾個方式：

1. 看有沒有 DNS 的 LB
2. 利用 Server 這個 response header 看有沒有不同的值
3. 利用 response 的 date header 看有沒有時間差（？

不太確定實際偵測方式是怎樣，對指令不熟跟 bash script QQ

另一個關注的系列是 前端工程的另一個選擇 Svelte，以前就有聽過了。最新一篇的 DAY05-變數的用法，滿好奇背後是怎麼做的。

技術講完了，再來講遊記的部分啦！

前幾天在阿布達比的時候，就看到百貨商場有一間家樂福，後來又在另一個 mall 也看到，今天去了杜拜的購物商場，也看到了家樂福！合理推測家樂福是杜拜跟阿布達比最大的量販店（？）

裡面賣的東西其實不貴，我覺得跟台灣沒差多少，拍兩張可樂跟零食的給大家看，台灣也有賣一樣的商品，可以自行比價。 1 AED 大概等於 8 塊台幣，直接乘 8 就好：

規模跟台灣那種比較大的差不多，然後還會賣一些熟食，最後買了沙拉跟飯團回飯店當晚餐吃。味道都不是很好吃，以後還是乖乖吃外面好了...

突然發現我明天的文章好像要在機場寫，寫完應該差不多登機了，然後就要去法國囉！