用於記錄一些本周閱讀過的文章、看過的影片、待讀的清單以及其他內容。
Open Source
今天下午的時候我在專案中看見了一個第三方庫 core-js，雖然之前看到過幾次但從來都不知道這個庫是做什麼用的，查資料的過程中意外看到了這篇文章：So, what’s next?
core-js 作者全職開源維護 9 年，月均收入從 2500 美元銳減到 400 美元。因為疏於推廣宣傳所以鮮少有人知道 core-js，作者長期一個人高強度維護 core-js 帶來了巨大壓力，並且在因為全職開源沒有其他收入造成經濟壓力時又遇上了事故，無奈之下向開源社區求助換來的卻是惡言惡語，最終不得已寫下這篇文章。
文章是今年2月份的時候發佈的，經過九個月後的今天，core-js 在 open collective 上每個月有 $1705 的固定收入和斷斷續續的一些不固定贊助，雖然相比最初的 $2500 少了一些，但還是好上了不少。core-js – open collective
這讓人不得不思考「全職開源」如何保障自己的收入能解決基本生活問題？獨立開發者該如何通過「開源」項目來賺錢？一些滿有意思的文章：
- core-js 作者快被缺钱“拖垮”了：全职做开源维护 9 年，月均收入从 2500 美元锐减到 400 美元
- 坐拥百万用户的开源项目没钱了，尤雨溪发推力挺被质疑的全职维护者
- Babel has no money because someone took a $130K salary and didn’t work
AI
BiliBili AI視頻總結
大陸一個以ACG相關內容起家的彈幕影片分享網站 BiliBili 在 10 月上線了一個功能「AI視頻總結」，在這之前也有許多非官方的 AI 視頻總結功能（大部分是以 @BiliBili 用戶的形式去觸發 AI 總結影片中的內容）
下圖為之前舊的總結方式，在影片評論區 @AI視頻小助理，它就會幫你總結影片的內容：
下圖則為官方新出的視頻總結功能：
AI 視頻總結時間在 0~2 秒，基本上是立即生成，所以個人猜測是在影片上傳的時候就已經進行了總結，而不是點擊時才實時總結。總結的內容、分段、時間點還算準確，不會有意義不明的內容，對於科普類的影片來說這個功能非常實用。
這個 AI 總結功能是由 B 站自研的 bilibili index 大模型提供技術支持的，目前只能總結部分的影片內容，还在不斷學習和優化中，所以生成的結果可能會有誤差，僅供参考。
bilibili index 大模型是B站今年7月發布的一個多場景應用的AI模型，除了搜尋和影片總結外，還能用於內容推薦、內容生成、內容審核等方面。 此外，這個大模型也支援了內測中的”搜尋AI助手”功能，使用者可以透過這個功能快速且準確地找到自己想要的內容。（這個功能需要用戶申請內測，所以我目前還沒有體驗到）
個人認為這是一個不錯的 AI 應用方向，希望各個平台都能夠推出這項功能，有選擇總比沒有好。
Spotify Podcast AI 語音翻譯
Spotify 未來將上線 Podcast 語音翻譯功能，Podcast 內容會透過 OpenAI 的語音生成技術在維持音色的前提下翻譯成別種語言。不過目前還是試播，只有以下三個 Podcast 提供這項功能，並且只支持翻譯成西班牙文（法語和德語將在未來幾天和幾週內推出）：
- Lex Fridman Podcast – “Interview with Yuval Noah Harari”
- Armchair Expert – “Kristen Bell, by the grace of god, returns”
- The Diary of a CEO with Steven Bartlett – “Interview with Dr. Mindy Pelz”
不過距離公布這項功能快兩個月了，目前還是只支持翻譯成西班牙文。
LINE 社群 AI 生成訊息摘要功能
近期 LINE 社群推出一項新功能「訊息摘要」，主要是使用 AI 總結 LINE 社群聊天室的訊息內容，當聊天室累積一定的訊息時，AI會「自動」在特定時間進行摘要。
當社群聊天室中有此訊息摘要功能，所有成員皆可瀏覽此摘要內容，只要點擊聊天室右下角的「訊息摘要」功能就可查看；目前此功能只支援 LINE 版本 13.16.0 及更高版本，電腦版目前尚不支援。而此功能使用 OpenAI 的生成式 AI 模型，因此準確性並非100%。
詳細的說明請看官方發布的公告 訊息摘要功能上線！用 AI 總結社群聊天室訊息！
其他關於 AI 的文章或工具：
- 7000字深度测评！Adobe 四大王炸产品 AIGC 功能体验总结
- OpenAI Devday：GPT Store 即將開放！客製化人手一隻 GPT 的時代要來了
- IIElevenLabs AI 語音生成，支持近 30 種語言和多種音色。以中文來說，某些發音和聲調還是不準確，但也已經很不錯了。英文的語音生成會更像真人。
- Translate.Video 透過 AI 一鍵將影片翻譯成 75 種語言，對影片工作者來說應該會是不錯的輔助工具。
- Imagen Google 開發的圖像生成 AI。
- 即時AI 需要微信登入，每天免費提供 10 次生成次數，生成速度大約為 10~20 秒，點擊放大精繪還需要再 10 秒。生成後的 AI 圖可以再調整細節，細節部分可以用點擊選取或者直接用文字描述，使用上感覺還算挺不錯的。
News
- The Top Programming Languages 2023 2023 年程式語言排行榜，今年 Python 依然是第一名，不過工作需求排名第一的還是 SQL，但通常職缺不會只招純SQL工程師，而是希望會 SQL 的同時還會其他語言(比如 JAVA, C++)。
- 苹果M3系列首发评测：Max早该如此 針對基於M3的iMac和基於M3 Max的MacBook Pro 16，深入測試了SPEC、核間延遲、分支預測能力等等指標。蘋果這兩顆新晶片到底進步有多大？ 專業軟體效能有多強？ Mac上能打遊戲了嗎？
- 用上M3芯片的苹果电脑，值得入吗？2023新款Mac上手评测 針對 M3max 芯片的 iMac, Macbook pro 進行評測，主要評測影像處理和遊戲方面的表現。最後分享了是否應該升級 M3 芯片的 Macbook pro 的看法。
- The 200 Best Inventions of 2023 TIME 由時代雜誌評選的 2023 年度最佳發明。
- The 100-Year Plan – WordPress WordPress 推出了一個百年計畫，可以花 38,000 美元買下 100 年域名和託管。
- 机上WiFi：50元打发无聊，还是买走打工人最后的自由？
- NEOM | What is THE LINE? 滿有意思的一個影片。這是沙特正在開發的 170 公里長的垂直城市，核心概念是以「人」為中心而不是車，沒有道路、汽車或排放物，100%使用再生能源，預計容納900萬人，佔地面積僅為34平方公里，交通方式為高鐵或者步行，端到端的交通約20分鐘。像是 Minecraft 裡面會看到的世界，有未來城市既是感。沙國王室堅持 2030 年完工，但外部專家估計需要約 50 年的時間，拭目以待吧。
Tools
- 沈浸式翻譯 瀏覽器翻譯擴展，可以同時顯示原文與翻譯，就不需要來回切換了，非常好用。
- DevDocs 將各個程式語言、框架…等工具的 API 匯總在一個頁面中查詢。
- echoserver 簡單的 mock API
- Biome Web 工具鏈，提供 Analyzer, Formatter, Linter
- depcheck 一個用於分析專案中的依賴工具，可以檢查哪些依賴目前是沒有在使用的，或者
package.json中缺少哪些依賴。（支援 JS, TS, React JSX, CoffeeScript, SASS, SCSS, Vue.js）
Front-end
- How layout position impacts three big web performance levers 文章中分享了 Web 中影像載入帶來的相關性能問題以及提高性能的方式。
- How to resize an image in HTML?
- HTML <picture> 響應式圖片 (Responsive Images) – 自動載入不同尺寸和檔案格式的圖片
- Mastering Responsive Web Design with Tailwind CSS: A Comprehensive Guide
- Building A Resizable Sidebar Component With Persisting Width Using React & TailwindCSS
JavaScript & TypeScript
- 14 Linting Rules To Help You Write Asynchronous Code in JavaScript
- Why I Like Using Maps (and WeakMaps) for Handling DOM Nodes
- Why Object.keys doesn’t and shouldn’t return (keyof T)[]
- Why doesn’t TypeScript properly type Object.keys?
- Typescript的结构化类型系统
React & React Native
- useEffect监听了很多变量怎么办？ 文章中提供了幾個關於 useEffect 依賴過多狀態的解決方案
- React Is Holding Me Hostage 作者通過幾個對比例子說明為什麼他認為 React 隨著版本迭代逐漸變得”複雜”，還在使用 React 的最大原因是因為生態系統、找工作好找以及很難捨棄(遷移成本)
- Fixing Race Conditions in React with useEffect
- Is React Having An Angular.js Moment? 作者認為 Server Components 的出現會影響很多現有的寫法和第三方庫，並且官方強制新版本使用 Next.js (Next.js 13.4 後開始使用 Server components)是否還為時尚早？React 和 Next.js 團隊應該採用更平衡的方法，不應過多”推銷” Server components。
- Headless Component: a pattern for composing React UIs 詳細的介紹了 Headless Component Pattern
- React Server Components, without a framework?
- Say Goodbye to Debouncing: Use “useDeferredValue” Hook
- React useTransition: performance game changer or…?
- React Native: Achieving Responsiveness through Scalable Fonts, Dimensions, and Pixels 根據設備螢幕縱橫比調整應用元素的佈局和樣式，調整的方式可以參考一下，不過個人覺得還有優化空間
- Why You Want Need React Query 作者用了一個簡單的例子說明爲什麼需要 React Query，以及使用 React Query 的優點是什麼。
- 了解 SWR 的運作機制，How this async state manager works ?
- React Query Render Optimizations
- Data Fetching Made Effortless with RTK Query
- 我打破了 React Hook 必须按顺序、不能在条件语句中调用的枷锁
- React18 源码解析之 useState 的原理
Others
- Why Rust is the most admired language among developers
- Media Queries, Responsive Design? Help me! 關於 CSS Media Query 的詳細教程
- 如何破解滑动验证码？
- 闲鱼被骗经历 作者分享自己在網購平台下單被詐騙了幾百塊人民幣和維權的過程。
