第 114 期 - 希望我的年終也有 40 個月

Created on 2022-01-04

本週專欄

JavaScript | 你常用的 Array Methods 是我常用的嗎？

Hi！大家好，我是神 Q 超人！在整理 StarBugs 推薦文章的時候，常常會看到許多人分享他們覺得常用且重要的 array methods。於是我就好奇了，那麼多人常用的 array methods 都會是相同的嗎？為了滿足這個好奇心，我就一口氣找了十篇介紹 array methods 的文章，並從這十篇文章中統計出五個，這些開發者覺得最讚的 array methods！

前端開發

Defensive CSS

作者舉了非常多的例子舉出可能會讓你的畫面跑版的 CSS 程式碼片段，並且告訴你該如何在該情境下建立防衛機制，減少使用者在使用時出現了意料外的問題。

How JavaScript Works behind the scenes?

這篇文章並沒有講解到許多太深的內容，但是對於 JavaScript 背後的運行原理講解的很全面易懂，很適合想要更了解 JavaScript，但又害怕看到許多專有名詞的初學者入門。

A Smarter JavaScript Mapper: array.flatMap()

如果看完本週的專欄，還對 JavaScript 的 array methods 意猶未盡，就繼續來看看這個也很方便的 Array.flatMap，Array.flatMap 可以讓你產生新 array 的同時，再過濾掉原 array 的某些元素。

React

In-depth explanation of state and props update in React

React 的更新渲染機制一直以來都是前端工程師必探討的話題，這篇文章深入討論 React 是如何利用 State & Props 的機制來更新整個元件的，有興趣的讀者不妨可以參考看看。

Inside Fiber: in-depth overview of the new reconciliation algorithm in React

React fiber 可以說是 React 16 一個相當重要的底層架構，在 fiber 的架構下讓網頁的 re-render 機制可以越來越優化，有興趣的讀者可以參考這篇文章，裡面深入了介紹 React fiber 架構下是如何優化以前的 reconciliation algorithm。

SSG vs. SSR in Next.js

隨著網頁越來越複雜，不同的 render 方式也成為了前端工程師必學的過程，從早期的 CSR 到後來的 SSR 甚至是最新的 SSG 都是前端工程師必學的，而 SSG 與 SSR 可以說是類似的概念只是在 server 端做了一些不同的動作，究竟這兩套渲染機制在 Next.js 下會有什麼不同的作用，有興趣的讀者不妨可以參考這個文章。

DevOps

11 Things I Learned After Becoming a Coding Interviewer

大家這次的年終有超過 40 個月嗎？要是沒有的話是不是要準備看新的工作機會啦 (大誤)，身為一個工程師擔任應徵者的機會通常比面試官來得多，作者在他將近七年的職涯中參加過 40 次的面試，他通常會因為感到緊張，尷尬和沒自信，而在 Coding 的面試階段失敗，他總是覺得面試官就像神一樣，隨時要對他宣判什麼，而最近他的職位變得相對資深，所以開始需要規律的當面試官，所以他想要分享 11 件事情給準備參加面試的人

面試官並不會將履歷鉅細彌遺地看過，過往的工作經驗也不代表目前的 Coding 技巧有多強，所以不用花太多時間去準備自我介紹的部分
面試官可能也跟應徵者一樣緊張，因為兩者都在做一件不是日常工作會做的事情，面試官也會怕被應徵者問倒
多說一點話可以幫助自己，畢竟一面試就馬上開始寫程式有點怪，總是需要暖機一下，例如利用前面提到沒那麼重要的自我介紹，然後再真的寫程式時，可以多跟面試官確定問題，解釋為什麼要這樣寫…等，讓彼此融入在面試的過程中，這將會使面試官留下較好的印象
寫程式的技能不是唯一的衡量標準，溝通能力是一個更重要的決定因素，所謂的溝通不只是在於你說了什麼，你如何去表達也很重要，例如發音，語速，面部表情…等
尋求協助並不丟臉，假如你在寫程式的過程中卡關了，可以適時地尋求協助，不要花太多時間讓自己一個人卡在某個點，因為面試官通常也都很樂意給出一些提示
一個問題並總是會有完美的答案，其實有時候面試官更想要看到應徵者，講答案逐步組織起來的流程，雖然這筆直接講出某個直接的答案要花時間
記得要選擇自己熟悉的語言，而不是工作要求裡面的，因為在面試的時候會特別容易被看破手腳，自己熟稔的語言比較不會出包
通常使用 Google 是可以被允許的，雖然一開始不會明說，但假如應徵者卡關覺得有需要的話，可以對面試官提出請求
當面試官再打字或是看別的地方時，可能是在做筆記或是看面試小抄，不一定是一邊工作一邊參加面試
當面試官不說話時，並不表示給應徵者吃閉門羹，因為有時候閒聊會讓應徵者受到影響，面試工程師職務時，還是會以技術相關的內容為衡量依據，其他的不用多想
面試官比應徵者更希望你可以獲得這份工作，因為招募是很昂貴的流程，因為招募一個人要花很多的時間，假如面試沒有通過就整個要再重來一次

GitHub’s top 10 blog posts of 2021

在跨入到 2022 之後，好像沒有看到太多 2021 的技術回顧文章，最近好像只有看到這篇 GitHub 回顧自己在 2021 最熱門的十大技術文章，前三名分別是 GitHub’s Engineering Team has moved to Codespaces，Behind GitHub’s new authentication token format 和 Introducing GitHub Copilot: your AI pair programmer，這樣的排名結果會讓你覺得出乎意料之外嗎？對於其他十大技術文章有興趣的人可以參閱內文

Spotify System Architecture

目前市面上有很多的音樂串流服務，例如 Spotify, Apple Music, Pandora, Soundcloud 和 Tidal，而今天作者想要跟大家解釋更多有關於 Spotify 這個音樂串流服務，首先從他的系統功能需求開始分析起，例如可以下載歌曲，發現音樂，Spotify Connect…等，接著預估他的 Scale 有多大，例如有多少使用者，歌曲的串流品質需要的頻寬，可以下載多少首歌，支援多少種語言…等，然後根據這些要點將系統架構給勾勒出來，並且逐步分析每一個元件使用的技術，函式庫與演算法…等，讓讀者可以跟著文章一步一步去做一次完整的系統架分析

StarBugs Weekly

StarBugs Weekly 由一群不寫文章就會想要亂花錢，但是又沒有那麼多錢，只好繼續寫文章的開發者所創立。
內容包含 Web 前端、中端、後端、DevOps、產品開發、精實創業，一切跟產品有關的知識，都是我們的守備範圍！

Writers:

@HannahLin - 從台灣到矽谷，熱愛前端的工程師女孩。
@KyleMo - 雜食性軟體工程師，喜歡的技術我都想學。
@Airwaves - Hi~我是 Airwaves，熱愛研究如何造輪子的前端工程師。
@Jenny - 我不寫 CSS。
@Andy - 目標成為用嘴巴工作的工程師，專長為網頁開發以及 K8s。

Maintainers:

@GQSM - Hi！我是神 Q 超人，一個先衝再說的男人。
@LarryLu - 我是 Larry，傳說中的 0.1 倍工程師！
@LukaTW - 一名全身都是死角的工程師。
@smalltown - 熱愛鑽研各種可以提升雲端服務品質及增進團隊開發效率的開源技術。

Feedback

本週呈現主題方式做了一些改變，希望讓讀者能夠更快速精準的找到自己要的資訊。也加入社群活動這個區塊，每週更新社群活動的資訊。如果有任何建議，歡迎私訊星巴哥技術週刊 FB 粉絲專頁與我們聯繫。