全選
清除
JavaScriptVueFull StackTypeScriptts-restAlgorithmVitestmarkdown-itVitePressNode.jsRemedaPerformanceLodashFront-EndQuasarPiniaElectronLLMBabylon.js
文章列表
共 41 篇文章
2025/12/23
那些黏不起來的元素，讓我們加點 JS 吧！
JavaScript
Vue
CSS sticky 好用，但是有限制，讓我們想辦法突破限制吧。
2025/09/30
初探 Nuxt UI v4
Vue
Nuxt UI 釋出 v4 了，免費開放許多進階元件，馬上來研究看看 ლ（´∀`ლ）
2025/09/18
自動解除的魔法呢？Vue Directive 和 Effect Scope
Vue
Directive 內沒有自動解除響應式資料與副作用的魔法呦 (・∀・)
2025/08/26
越暗的地方你越亮，透過 JS 標記關鍵字吧
Vue
JavaScript
在 JavaScript 實作網頁文字搜尋關鍵字的 highlight 效果
2025/08/14
前後端不再打架，讓 ts-rest 發揮 TypeScript 的魔法吧！（實務篇）
Full Stack
TypeScript
ts-rest
紀錄一下使用 ts-rest 實際開發的點點滴滴
2025/08/07
如何實現靈活的資料排序
Algorithm
JavaScript
如何實現靈活的資料排序
2025/06/30
酷酷元件背後的星點 - EP01：前言
Vue
小廢物們背後的技術亮點
2025/06/12
甚麼？圖片還沒好喔！Σ(ˊДˋ;)
Vue
Vitest
確保圖片都乖乖載入完成，一個都不能少！順便玩玩看 Vitest 的 Browser Mode(・∀・)９
2025/05/26
懶有懶的好處，聊聊 Lazy Evaluation
Remeda
JavaScript
Performance
remeda 實作中有 lazy evaluator 有甚麼好處？來 Bench 一下看看◝( •ω• )◟
2025/05/19
幫 Quasar Menu 加上 hover 開啟功能
Vue
Quasar
原本想說應該很簡單，仔細探討後發現事情沒有像憨魚想的那麼簡單。(◉◞౪◟◉ )
2025/03/25
Vue 之 triggerRef 問題
Vue
前陣子使用 triggerRef 時發現某些情境下無法觸發響應，一起來看看發生甚麼事吧 (´・ω・`)
2025/03/21
你是個成熟的 function 了，該自己記得結果了
JavaScript
Lodash
Performance
最近遇到從大矩陣資料找出指定資料的需求，是時候使用 memoization 來提升效能了。੭ ˙ᗜ˙ )੭
2025/02/25
remeda piped 之 reference 問題
Remeda
JavaScript
使用 remeda piped 時，不小心給自己埋了地雷，來筆記一下。(。-`ω´-)
2025/01/30
Sound Blocks - EP01：前言
Babylon.js
同一個白噪音聽到快背起來了，來試試自己做一個 3D 白噪音混音器吧。◝(≧∀≦)◟
2025/01/22
CodToys - EP04：請支援近義詞
Electron
LLM
忘記原本的關鍵字怎麼辦？請支援近義詞搜尋 ლ(╹ε╹ლ)
2025/01/17
善用 computed
Vue
Performance
常聽說不要把複雜的表達式寫在 template 裡，應先用 computed 裝起來，來試試有甚麼差別吧。ლ（´∀`ლ）
2025/01/15
關於 Vue 資料流那檔事
Vue
Vue 資料流實作筆記，還請大家多多指教 (*´∀`)~♥
2025/01/02
臉被切到了怎麼辦！來自定義 markdown 語法吧
markdown-it
顏文字換行會原地變為一坨亂碼，該怎麼辦呢？(PД`q｡)
2025/01/02
CodToys - EP03：顏文字資料庫
Electron
上一章節我們完成了快捷鍵開關視窗功能，這一章節我們來實作功能選項部分吧！
2024/12/26
CodToys - EP02：功能選項
Electron
上一章節我們完成了快捷鍵開關視窗功能，這一章節我們來實作功能選項部分吧！
2024/12/22
聽說 forEach 比 for 迴圈慢？
JavaScript
Performance
常聽到別人說特定情境下 forEach 比 for 迴圈還慢，剛好有個好機會，讓我來試試看吧。ԅ(´∀` ԅ)
2024/12/21
CodToys - EP01：緣起
Electron
沒有順手的小工具怎麼辦？用 Electron 動手做一個吧！(´,,•ω•,,)
2024/12/10
VitePress 之所以我說那個響應式圖片呢？
VitePress
VitePress 沒有 Nuxt Image 那樣方便且自動的圖片處理，該怎麼辦呢？ლ(・´ｪ`・ლ)
2024/10/07
Vue 的 shallowRef 是啥？和 ref 有甚麼差別？
Vue
熟悉 Vue 的朋友們一定知道 `ref` 是啥，一起來看看 `shallowRef` 和 `ref` 有甚麼差別吧！ԅ( ˘ω˘ԅ)
2024/09/09
要不要來點 Side Project 啊？ԅ(´∀` ԅ)
JavaScript
Front-End
分享一下鱈魚的 Side Project 靈感與發想。(๑•̀ㅂ•́)و✧
2024/09/05
Vue 3.5 更新，onWatcherCleanup 與 onCleanup
Vue
Vue 3.5 更新新增了 onWatcherCleanup，用於清理 watcher 中的副作用（Side Effect），可是原本的 watch 已經有 onCleanup，所以到底差在哪呢？(╯▽╰ )
2024/08/26
藉由 Sentry 讓錯誤無所遁形吧！
Front-End
系統上線後常常遇到前端錯誤不好追蹤問題，使用者很難說得清楚發生甚麼事，Sentry 可以協助記錄錯誤，並且提供更多資訊，讓開發者更容易追蹤問題。
2024/08/23
打包後順便壓縮一下吧，使用 Node.js 自動產生壓縮檔
Node.js
JavaScript
有些案子需要打包、壓縮後交付，雖然壓縮按一下很簡單，但是一直重複就不簡單了。讓我們使用腳本自動產生壓縮檔，不用再手動壓縮了。♪(^∇^*)
2024/07/25
所以我說那個型別呢？來一個有形別提示的 Vue h function 吧！
Vue
Quasar
TypeScript
先前提到 Quasar 的 Dialog Plugin 很好用，再讓我補充一個用法。ლ(╹◡╹ლ)
2024/07/16
TypeScript 之 DX 體驗更好的列舉資料定義方式
TypeScript
不管是 enum 和 literal 的方式其實都有些小缺點，以下推薦一個個人認為體驗更好的方式
2024/07/15
藉由 Vue h function 讓 Quasar Dialog 更簡單複用
Vue
Quasar
Quasar Dialog 的 Invoking custom component 很好用，但是有些困擾的地方，一起來看看有甚麼辦法吧。
2024/07/10
Vue 元件太肥，切換頁面卡卡怎麼辦？讓 Suspense 登場吧！
Vue
切換頁面卡卡有很多種原因，這裡舉的例子只針對元件太大的情境。除了想辦法拆分外，還有一個方法就是利用 Vue 的 Async Component。
2024/07/01
誰偷了我的鳳梨！聊聊意外修改 Pinia 資料問題
Vue
Pinia
有時候使用 Pinia 會遇到資料意外變更問題，這其實不是鳳梨的錯，讓我們看看怎麼回事吧。( ´ ▽ ` )ﾉ
2024/06/28
前後端不再打架，讓 ts-rest 發揮 TypeScript 的魔法吧！（概念篇）
Full Stack
TypeScript
ts-rest
ts-rest 可以實現從伺服器到客戶端的全型別安全，可以有效降低前後端溝通血流成河的機率。(´,,•ω•,,)
2024/06/28
回不去惹，用 await-to-js 讓你的 Promise 操作簡潔又俐落！
JavaScript
可以在特定情境下簡化 Promise 寫法
2024/06/20
Vue Reactive 使用筆記
Vue
現在官方推薦使用 ref 就行，所以 reactive 還有甚麼用處呢？讓我們筆記一下。(。・∀・)ノ
2024/06/06
Vue watch 前先小等一下
Vue
watch 不是不能用，而是在使用 watch 之前，先想想有沒有其他方案，真的沒有才用 watch。
2024/06/06
小心遺漏的 watch 讓網頁爆炸
Vue
某些情境會讓 watch 不會自動解除，一起來看看吧！(ˊДˋ;)
2024/04/17
Vue 泛型元件，讓 TypeScript 更精確
Vue
Vue 3.3 終於新增了泛型元件（Generic Component），可以在 TypeScript 環境中得到更準確的型別提示了！ˋ( ° ▽、° )
2024/04/10
其實 Vue 不一定要在 onMounted 取 API
Vue
Vue 你還在 onMounted 中取 API 嗎？其實不一定要這樣做，來看看不同做法吧。( ͡~ ͜ʖ ͡°)
2024/03/24
好 pipe 不用嗎？藉由 remeda 讓程式碼更簡潔彈性吧！
Remeda
JavaScript
pipe 代表函數式程式設計中的概念，利用多個功能結合在一起，資料依序通過每個功能進行處理