---
# System prepended metadata

title: A1 JSDC 2020

---

# A1 JSDC 2020

## 相關紀錄

### ==用API mocking 讓前端不再苦苦等待==
#### 主題內容
> `如何在後端還沒完成的狀況下先行開發(但interface需要先定義出來才有用)。`

1. 就是等
2. Express 自己弄
3. JSON server假資料
4. **MSW**
5. **MirageJS**

:::success
📝4、5 是主要分享的內容
:::

#### A1討論
* 使用上面說的mock data來做先行開發，不適合我們的專案，因為我們目前後端開的interface基本上到最後都會有點不一樣，還不如等著在做就好。

* 我有寫一篇關於JSON Server的筆記，有興趣可以看看 >> [🌝[T]JSON Server](https://hackmd.io/@Ru/Sypv1UIdD)

---

### ==JavaScript 中鼓勵用非同步的API，但用了就會提升效能避免阻塞嗎?==
#### 主題內容
> `Event Loop + 非同步語法(ex:SetTimeout, Promise)並不會讓主執行緒不被複雜運算卡住
非同步語法只是讓複雜運算晚一點發生，實際執行運算的地方還是在主執行緒。`

* MDN Web Worker
  web worker可以開另外一個執行緒，把複雜運算放到web worker來做，就能避免主執行緒被複雜運算占用而有卡住現象(前端和後端都有web worker)
  - 前端卡住現象:使用者畫面hang住
  - 後端卡住現象:無法取得回應

#### A1討論
---

### ==用不用 TypeScript 隨便你，反正我是用了==
#### 主題內容
> `分享Typescript之美`

#### A1討論
* KEY Remapping => queryselector
  ![](https://i.imgur.com/OOPUUps.png)

* Map Type => Partial
  ![](https://i.imgur.com/n1WpqIq.png)

---

### ==採用 TypeScript 前你該考慮的十件事==
#### 主題內容
#### A1討論
* 狀態機 => ngrx (non-shipping)

---

## 相關資訊
[【2020JSDC】上半場 - 道場共筆](https://hackmd.io/UuG6jn4zR-GfDFGcgVJc-Q)
[【2020JSDC】下半場 - 術場共筆](https://hackmd.io/@JSDC/SJJyHrNDv)
[【2020JSDC】大會議程 + Slide](https://2020.jsdc.tw/agenda/?fbclid=IwAR3YYCU8VkNS1wGaUtmD3lC-x0SFBOkWdKRo5BCfncY1LdReASC5TSMeEa0)

![](https://i.imgur.com/5ykFbJj.png)
