JHJordan Hsuinjordanhsu.dev·Feb 28, 2023 · 2 min read五分鐘學前端系統設計面試(六)- 來做 Facebook 貼文串的前端吧!下此為該文章的重點整理:https://www.greatfrontend.com/questions/system-design/news-feed-facebook 系列文第六篇文章我們繼續探討實作 Facebook 的貼文、新增貼文功能有哪些優化方向與細節 貼文優化 只在需要時提供資料驅動的依賴性 Facebook 使用 Relay 來向後端抓資料,Relay 是一個基於 JavaScript 的 GraphQL 客戶端,其結合 React 元件和 GraphQL 來讓 React 元件...00
JHJordan Hsuinjordanhsu.dev·Feb 27, 2023 · 1 min read五分鐘學前端系統設計面試(五)- 來做 Facebook 貼文串的前端吧!中此為該文章的重點整理:https://www.greatfrontend.com/questions/system-design/news-feed-facebook 系列文第五篇文章我們會深入探討實作 Facebook 的貼文串有哪些優化方向與細節 優化與探討(Optimizations) 貼文串中主要有幾個元件: 貼文串 UI 貼文 UI(下篇探討) 新增貼文 UI(下篇探討) 本篇主要先討論貼文串優化的相關細節 渲染方式 *** 篇幅關係,此處筆者假設讀者已有 SSR / C...00
JHJordan Hsuinjordanhsu.dev·Feb 27, 2023 · 2 min read五分鐘學前端系統設計面試(四)- 來做 Facebook 貼文串的前端吧!上此為該文章的重點整理:https://www.greatfrontend.com/questions/system-design/news-feed-facebook 系列文第四篇文章我們會實際用 RADIO Framework 來組織做出一個 Facebook 的貼文串需要考慮的事 問題範圍定義(Requirements) 如下圖,設計一個貼文串,包含使用者可與之互動的貼文列表 需要哪些核心功能 瀏覽自己與朋友建立的貼文 對貼文按讚(或心情) 建立和發佈新貼文 留言和轉發貼文可以...00
JHJordan Hsuinjordanhsu.dev·Feb 21, 2023 · 4 min read擴充 ChatGPT,查資料不必再受困於分頁叢林中google chrome 插件分享與前端技術交流 Highlight unknown sentence, and let’s ChatGPT explain to you 年後收假前筆者寫了一個輔助使用 ChatGPT 的 chrome extension痛點來自於筆者在查網頁資料時,如果有遇到不懂的詞或段落,就需要額外切分頁先查,查完再跳回來很容易忘記原本在幹嘛(日常分頁太多直接一個大腦霧) 因此筆者秉持著工程師天生就是懶(x,追求高度自動化(o 的特質,再思考有什麼解法可以讓使用 Ch...00
JHJordan Hsuinjordanhsu.dev·Feb 11, 2023 · 1 min read五分鐘學前端系統設計面試(三)- RADIO Framework 下此為該文章的重點整理:https://www.greatfrontend.com/system-design/framework 系列文第三篇文章繼續介紹如何系統性回答前端系統設計面試的問題 Data Model(分配 10%的面試時間) 接著我們討論在 client 端的資料欄位,client 端的資料來源有兩種 server 來的資料(database) 常見的例子包含使用者資料(名字、個人資料、頭貼)和使用者產生的資料(貼文、留言) client-only 的資料(state) ...00