開源 // 開發者工具

開源 專案

閒不下來就寫成套件。有些還在用，有些被我自己棄坑，有些每週還有幾萬次下載——連我自己都有點驚訝。

建構記錄 // 公開儲存庫

開源與 開發者工具

01

開源

  • 積極參與開源貢獻。
  • 打造開發者喜愛的工具。
02

效能

  • 以無障礙與效能為核心。
  • 社群驅動開發。
03

套件

  • 發布 npm 套件回饋生態系。
  • TypeScript 優先，型別安全 API。
04

協作

  • 歡迎貢獻與回饋。
  • 與社群共同打造解決方案。

專案與套件

react-in-viewport

進行中2017 - 至今
350 顆星46k/week

使用 Intersection Observer API 偵測 React 元件是否在視窗內的套件。提供 Hook 介面，以出色效能偵測視窗可見性。

  • 350+ GitHub 顆星
  • 每週 46k+ 次下載
  • Tinder 及其他主要公司使用中
ReactTypeScriptIntersection Observer APIJestRollup
GitHubnpm線上展示

react-aspect-ratio

進行中2017 - 至今
104 顆星12k/week

為 React 元素保留空間、防止瀏覽器回流（版面位移）的元件。有助於維持響應式版面並改善 Cumulative Layout Shift 核心網站體驗指標。

  • 104+ GitHub 顆星
  • 防止瀏覽器回流與版面位移
  • 改善核心網站體驗指標分數
ReactTypeScriptCSSJest
GitHubnpm

idle-tracker

維護中2019 - 至今
21 顆星2k/week

追蹤瀏覽器閒置與使用者怠速狀態的輕量 JavaScript 套件。適用於實作自動登出功能、閒置時暫停動畫，或追蹤使用者參與度。

  • 21+ GitHub 顆星
  • 零依賴套件
  • 跨瀏覽器相容
JavaScriptBrowser APIsEvent Listeners
GitHubnpm

react-i13n

進行中2015 - 至今
384 顆星

為 React 應用程式提供高效能、可擴展且可插拔的埋點方案。提供完整的追蹤框架，用於記錄 React 應用中的使用者互動與分析數據。

  • 384+ GitHub 顆星
  • Yahoo 開源專案
  • 核心貢獻者與維護者
ReactJavaScriptAnalyticsInstrumentation
GitHubnpm

subscribe-ui-event

維護中2015 - 至今
110 顆星

提供跨瀏覽器、高效能的瀏覽器 UI 事件訂閱方案。以節流與防抖技術優化事件處理效能。

  • 110+ GitHub 顆星
  • Yahoo 開源專案
  • 核心貢獻者與維護者
JavaScriptBrowser APIsEvent ManagementPerformance
GitHubnpm