OTree Frontend Blog

在這篇的文章中，我們會繼續根據 Typescript Document 中的 Everyday Types，介紹剩下幾個 Typescript 中常見的型別及用法，藉由認識所有基本以及常見的型別，來幫助我們在使用 Typescript 開發時，能更加的上手。

在上一篇文章中，我們簡單介紹了一下 Typescript 與 Javascript 的關聯，以及對 Javascript 開發者來說，剛使用 Typescript 需要知道的概念。而在接下來的文章中，我們會根據 Typescript Document 中的 Everyday Types ，先來介紹 Typescript 常見的型別，藉由認識基本以及常見的型別，來幫助我們能在面對複雜的情境時，使用合適的型別。

Javascript 是一門動態型別語言 (Dynamically typed)，同時也是一門弱型別語言 (Weakly typed)，因此我們不僅可以在程式撰寫時不用明確的型別宣告，也可以在 runtime 的過程中任意透過顯性或隱性的方法來更換變數的型別，雖然這樣特性讓 Javascript 在開發上變得更加簡單，也更靈活多變，但也因此更加容易遇到沒有預期的錯誤。Typescript 是基於 Javascript 而開發出來的一門開源程式語言，也就是 Javascript 的超集 (Superset)，透過靜態型別檢查，來幫助我們能在開發編譯的過程中，就幫助我們找出這些可能造成錯誤的地方。

GraphQL 是一套開源的 API 標準，最早是由 Facebook 內部在 2012 年開始開發，直到 2015 年才公開發布。與 RESTful API 比起來，GraphQL 透過由 client 端所定義的資料結構，再由 server 端返回相同資料結構的對應資料，來避免 server 端回傳多餘資料，加快 client 端獲取資料的速度，因此以高彈性以及高效能所著名。最近終於有機會使用到 GraphQL，也藉此機會來重新好好認識 GraphQL。

隨著前端逐漸開始重視使用者體驗，網頁的效能也越來越受到強調，也有越來越多的人在討論最網頁載入效能優化（Web Performance Optimization）。而大部分都會圍繞在透過減少 bundle size，來減少載入時間。而整個網頁，從使用者進入到渲染出整個頁面，其實其中有很多步驟都是會影響網頁效能，像 DOM 過大（Excessive DOM size）就是其中一項。