第 179 期 - 星巴哥成立後的第一個颱風！
本週專欄
Refactor | 這 3 個重構技巧我很喜歡，推薦給你 feat. JavaScript
在本週的專欄中，神 Q 超人要跟大家分享他前陣子讀了鼎鼎大名的「重構｜改善既有程式的設計」後，覺得很喜歡的幾個重構技巧。
雖然文中的範例都是用 JavaScript 寫的，但不論你寫的是什麼語言、是新手還是老手，只要你對程式碼的可讀性和可維護性有所追求，那麼這篇文章就絕對值得你一讀。快跟著神 Q 一起進入重構的世界，學習更多有趣的技巧吧！
GenAI
假如生成式 AI 產生的程式碼都可以直接使用的話…
雖然自己有透 GitHub Copilot 和 ChatGPT 來增加生產力，但其實他產生出來的程式碼還是需要人工來檢查、修改，才能真正使用。最近看到一個叫做 LLM Strategy 工具提出來的想法滿不錯的，當工程師在撰寫 Python 時，只需要在程式碼上面加上 Decorator，例如: @llm_strategy(OpenAI(max_tokens=256))，那麼在接下來的 Class Method 中就只需要寫上需求註解，不需要撰寫程式碼，GenAI 就會幫你把需要的程式碼補完 (看附圖應該可以更好理解)
或許在不久的將來，當 GenAI 產生的程式碼都可以直接使用時，工程師就可以專注在需求上，而不需要花時間在撰寫程式碼上，寫程式的門檻也會更低！
有沒有 On Premise 的 ChatGPT 啊？！
在雲端世界的解決方案中，企業常常因為資料安全性的考量，而不願意將資料上傳到雲端，這時候就會需要採購 On Premise 的版本，那在生成式 AI 的領域裡有沒有類似 ChatGPT 的 On Premise 的版本呢？
答案當然是肯定的，目前有看到幾個比較多人使用的專案，分別是 ColossalChat, privateGPT, localGPT，其中 privateGPT 使用的 LLM 為 GPT4All，localGPT 則是使用 Vicuna-7B，推薦給有類似需求的人
開發 AI 應用服務要怎麼抓蟲?
一般來說，開發 Web 或是 Mobile App 時，都會使用諸如 Sentry 或是 Rollbar 的服務來協助追蹤程式遇到的問題，那在開發 AI App 時，要怎麼抓蟲和監控問題的發生呢?
在生成式 AI 開發框架中，相信不少人都是使用 #LangChain，而其實它也有推出類似的服務產品，也就是今天要提到的 #LangSmith，底下將介紹他所提供的重要功能
- Debugging: 視覺化使用者與 AI App 互動過程中每一個步驟輸入以及輸出 AI Model 的資訊，同時還會給出不預期的結果，錯誤，延遲時間，Token 的使用量，讓開發者有線索可以去找出可能是哪個地方出了問題；並且讓開發者可以直接從 LangSmith 的 UI 去做範例的測試，不用再複製貼上去 OpenAI Playground
- Testing: 軟體測試最直接的方式，不外乎就是修改程式碼，然後把資料丟進去後觀察輸出有沒有符合預期，而 AI App 測試時，會需要比較多的輸入資料，LangSmith 讓開發者可以快速從正在追蹤的問題，或是透過手動上傳的方式來建立資料集，開發者就可以立刻輕鬆的使用他們來測試撰寫的 Chain 和 Prompt 是否符合預期
- Monitoring: 程式當然不會再開發完成就結束了，當服務在線上持續運行時，時時刻刻監控其狀態是相當重要的，透過 LangSmith 可以去監控 AI App 的運行效能，例如延遲和成本，同時也要追蹤 Model 和 Chain 的運行效能，並且可以建立儀表板來了解目前使用者的使用狀況與體驗
前端開發
The End of Front-End Development
近幾年來 AI 急速成長，有許多前端工程師都會認為自己會被 AI 所取代，因為他們甚至能夠根據畫在紙上的 UI，產生對應的 HTML、CSS 和 JavaScript，這聽起來非常可怕，也讓許多前端工程師開始焦慮自己是否要繼續走下去。但是作者在這篇文章中指出，早在 CSS 誕生後的兩年內，第一個號稱不需要寫任何程式碼就能建構網站的 Homestead 就誕生了，但是現在前端工程師絕種了嗎？並沒有。而作者也有從其他面向去討論 AI 對軟體工程師的影響，最推薦的是最後一段寫給有熱忱的開發者的一段話。早上醒來看完這篇文章，心裡的暖都分不清到底是來自於作者的文字還是夏天的太陽。
The modern way of serving images
文章中一開始用數據表示，從 HTTP Archive 收集到的資訊當中，至少 70% 的網站都利用當作網站裡最吸引人的部分，但只有 34% 使用了 <img srcset> 建立響應式和高效能的圖片顯示。作者會在文章中解釋為什麼我們會需要建立響應式的圖片，以及我們要如何利用 <img srcset> 和 <picture> 改善顯示或載入圖片時，在網頁遇到的常見問題以及使用者體驗！
Zedux: Is this the one?
Zedux 是為最自由的 React 所建立的狀態管理工具，它潛伏了 5 年多仔細研究 React 狀態管理工具的生態，然後將各種狀態管理工具的優點全部 all for one 到自己身上。Zedux 中的 atom 參考了 Recoil，也吸收了 React Query 擁有簡單版本的 query 和 mutation，其中也包含 Redux 和 Jotai 的所有功能。那看來只要學習這套，之後怎麼鬼轉其他狀態管理工具都沒問題了。 😂
Golang
Caching Golang tests in CI
這篇文章作者的公司 Airplane 用 Go 來開發產品，並且在每次有新 commit 時就在 Github Action 上跑單元測試。但因為單元測試跑得時間太久了（可能測試寫太多了，真是一間好公司XD），因此他們用了 cache 來大幅加速。如果你的公司也有測試太多要跑很久的問題，那也可以參考看看這篇文章的做法哦～
Built-in functions in Go 1.21
Go 從版本 1.21 開始又多了 min、max、clear 三個內建函數，這篇文章用很簡短的幾個例子帶你看看他們，以後寫程式的時候就可以直接拿來用啦！
Random testing in Go
這一系列講 Go Fuzzing Test 的四篇文章終於寫完啦，看完這四篇，除了會對 Fuzzing Test 有基本的認識之外，應該也會知道怎麼用他來找出一些奇怪的 bug。如果你對 Go 的基本語法還有單元測試已經非常熟悉，那現在來學 Fuzzing Test 剛剛好。
Maintainers:
- @LarryLu - 我是 Larry，傳說中的 0.1 倍工程師！
- @GQSM - Hi！我是神 Q 超人，一個先衝再說的男人。
- @LukaTW - 一名全身都是死角的工程師。
- @smalltown - 熱愛鑽研各種可以提升雲端服務品質及增進團隊開發效率的開源技術。
- @RicoChen - 熱愛許多技術且努力看透技術的本質，如果有什麼好玩的技術，還請各位歡迎直接找我聊聊。