@jordanhsu

五分鐘學前端系統設計面試（六）- 來做 Facebook 貼文串的前端吧！下

Feb 28, 2023 · 2 min read · 此為該文章的重點整理：https://www.greatfrontend.com/questions/system-design/news-feed-facebook 系列文第六篇文章我們繼續探討實作 Facebook 的貼文、新增貼文功能有哪些優化方向與細節貼文優化只在需要時提供資料驅動的依賴性 Facebook 使用 Relay 來向後端抓資料，Relay 是一個基於 JavaScript 的 GraphQL 客戶端，其結合 React 元件和 GraphQL 來讓 React 元件...

五分鐘學前端系統設計面試（五）- 來做 Facebook 貼文串的前端吧！中

Feb 27, 2023 · 1 min read · 此為該文章的重點整理：https://www.greatfrontend.com/questions/system-design/news-feed-facebook 系列文第五篇文章我們會深入探討實作 Facebook 的貼文串有哪些優化方向與細節優化與探討（Optimizations）貼文串中主要有幾個元件：貼文串 UI 貼文 UI（下篇探討）新增貼文 UI（下篇探討）本篇主要先討論貼文串優化的相關細節渲染方式 *** 篇幅關係，此處筆者假設讀者已有 SSR / C...

五分鐘學前端系統設計面試（四）- 來做 Facebook 貼文串的前端吧！上

Feb 27, 2023 · 2 min read · 此為該文章的重點整理：https://www.greatfrontend.com/questions/system-design/news-feed-facebook 系列文第四篇文章我們會實際用 RADIO Framework 來組織做出一個 Facebook 的貼文串需要考慮的事問題範圍定義（Requirements）如下圖，設計一個貼文串，包含使用者可與之互動的貼文列表需要哪些核心功能瀏覽自己與朋友建立的貼文對貼文按讚（或心情）建立和發佈新貼文留言和轉發貼文可以...

擴充 ChatGPT，查資料不必再受困於分頁叢林中

Feb 21, 2023 · 4 min read · google chrome 插件分享與前端技術交流 Highlight unknown sentence, and let’s ChatGPT explain to you 年後收假前筆者寫了一個輔助使用 ChatGPT 的 chrome extension痛點來自於筆者在查網頁資料時，如果有遇到不懂的詞或段落，就需要額外切分頁先查，查完再跳回來很容易忘記原本在幹嘛（日常分頁太多直接一個大腦霧）因此筆者秉持著工程師天生就是懶（x，追求高度自動化（o 的特質，再思考有什麼解法可以讓使用 Ch...

五分鐘學前端系統設計面試（三）- RADIO Framework 下

Feb 11, 2023 · 1 min read · 此為該文章的重點整理：https://www.greatfrontend.com/system-design/framework 系列文第三篇文章繼續介紹如何系統性回答前端系統設計面試的問題 Data Model（分配 10%的面試時間）接著我們討論在 client 端的資料欄位，client 端的資料來源有兩種 server 來的資料（database）常見的例子包含使用者資料（名字、個人資料、頭貼）和使用者產生的資料（貼文、留言） client-only 的資料（state） ...