博客 / 列表

林恆 - async/await 到底要不要加 try catch？我來給你整明白！

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 前言 現在寫異步代碼，基本上就是 Promise 和 async/await 兩種寫法。雖然這倆都能幹同樣的活，但 async/await 寫起來更像同步代碼，讀起來更順眼，所以很多人都説它是"異步編程的終極方案"。 不過有個問題挺讓人糾結的：用 async/await 的時候，到底要不要加 try catch 來抓

前端

林恆 - Uni-app 性能天坑：為什麼 v-if 刪不掉 DOM 節點

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 在開發自定義 Swiper 或長列表組件時，為了優化性能，我們通常會給每一項加上懶加載邏輯： view class="item" template v-if="shouldRender" slot :name="'slot-' + index" / /template /view 神奇的事情發生了： 哪

前端

林恆 - 前端拖拽，看似簡單，其實處處是坑

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 拖拽功能是前端開發裏最常見的交互之一： 從 百度網盤的文件拖拽，到 Figma 的畫布操作，都離不開拖拽能力。 很多人會覺得——拖拽不就是 mousedown + mousemove + mouseup 嗎？三行代碼就能搞定！ 但當你真正落地到生產環境時，坑點就會接踵而來： PC 和移動端事

前端

林恆 - ES6 這 8 個隱藏外掛，知道 3 個算我輸！

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 “代碼寫得少，Bug 自然少。”——魯迅（並沒有説） 今天不聊 React、不聊 Vue，回到語言層，挖一挖那些“官方早就給了，但我們總自己造輪子”的 ES6 冷門 API。 它們每一個都經過瀏覽器真·原生實現，無 polyfill 也能跑，一句頂五句，看完直接複製粘貼就能讓同事驚呼“還有這種

前端 , Javascript

林恆 - 用這 9 個 API，我把頁面性能幹到了 90+

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 最近項目上線，用户一多，頁面就卡得不行。首屏加載 3 秒起，滾動掉幀，手機發燙……被 QA 喊去聊了好幾次。 沒辦法，只能低頭研究性能優化。翻了一圈文檔和實戰案例，發現現代瀏覽器其實給了我們很多“外掛”——那些你可能聽過但一直沒用起來的高級 API。 真正用上去之後，頁面流暢度提升非常明顯。今天就來分享我

前端

林恆 - 0.1加0.2為什麼不等於0.3

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 這個問題你可能在面試、線上 Bug、甚至隨手寫 Demo 的時候都見過： console.log(0.1 + 0.2 === 0.3); // false 很多人第一反應是“浮點數精度問題”，但如果繼續追問： 為什麼偏偏是 0.1、0.2 這種小數出問題？ “精度”到底精在哪一位、丟在哪一步？

前端

林恆 - 用户 Token 到底該存哪？

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 面試官問："用户 token 應該存在哪？" 很多人脱口而出：localStorage。 這個回答不能説錯，但遠稱不上好答案。 一個好答案，至少要説清三件事： 有哪些常見存儲方式，它們的優缺點是什麼 為什麼大部分團隊會從 localStorage 遷移到 HttpOnly Cookie 實

前端

林恆 - 這 10 個 Vue3 性能優化技巧很實用，但很多項目都沒用上

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 今天來分享 10 個 Vue3 的性能優化技巧。 核心原則： 減少不必要的響應式追蹤 避免無謂的 DOM 操作 按需加載資源 咱也不要為了優化而優化！小項目用默認寫法完全沒問題，優化應在性能瓶頸出現後進行。 這些技巧不難，但都非常關鍵。 看完你會

前端

林恆 - 前端 HTML 轉 PDF

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 前端 HTML 轉 PDF 的工具函數，核心作用是：把網頁中指定 ID 的 DOM 元素（比如表格、報表、表單等），通過html2canvas和jspdf兩個庫轉換成 PDF 文件並下載到本地。 簡單説：它能讓用户 “一鍵下載” 網頁上的某個區域為 PDF（比如報表、數據統計頁、合同預覽頁等），還預留了 “水印功能” 的註釋代碼

前端

林恆 - 面試官：説説看，用户登錄後拿到的 Token，你應該怎麼存？存哪裏？

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 開篇：一個經典的面試題 “説説看，用户登錄後拿到的 Token，前端應該怎麼存？” 這個問題看似簡單，卻能清晰地分辨出一個前端開發者對安全的理解深度。是存到 localStorage？sessionStorage？還是 Cookie？又或者是內存裏？不同的選擇背後，是截然不同的安全考量。 今天，來聊一聊 Toke

前端

林恆 - 拒絕 rem 計算！Vue3 大屏適配，我是這樣做的

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 最近公司又接了個數據可視化大屏的需求，設計稿是標準的1920 x 1080。 拿到設計稿的那一刻，我的內心是拒絕的... 🤯 大家都知道，做大屏適配最煩的就是還原設計稿座標。 以前我嘗試過各種方案： rem / vw: 每一個 px 都要轉換，寫 css 的時候旁邊還得開個計算器，太累。

前端

林恆 - Vue開發三年，我才發現依賴注入的TypeScript正確打開方式

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 你是不是也遇到過這樣的場景？ 在Vue項目裏，為了跨組件傳遞數據，你用provide和inject寫了一套祖孫通信邏輯。代碼跑起來沒問題，但TypeScript編輯器總給你畫紅線，要麼是“類型any警告”，要麼就是“屬性不存在”的錯誤提示。 你看着一片飄紅的代碼區，心裏想着：“功能能用就行，類型標註太麻煩了。”於是，

前端

林恆 - 徹底弄懂KeepAlive

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 前言 開發過Vue應用的同學對KeepAlive功能應該都不陌生了，但是大家對它的理解是隻停留在知道怎麼用的階段 還是説清晰的知道它內部的實現細節呢，在項目中因KeepAlive導致的的Bug能第一時間分析出來原因並且找到解決方法呢。這篇文章的目的就是想結合Vue渲染的核心細節來重新認識一下KeepAlive這個功能。 文章是

前端

林恆 - Electron 的西天取經

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 我本身是做 Web 開發的，最近需要寫個小工具，調用一些系統 API，就選擇了比較成熟的 Electron。結果業務代碼寫了三小時，環境配置、鏡像、文件引用、打包路徑、體積過大、文件被鎖定……各種問題卻折騰了將近三天。寫下這篇筆記，記錄這一路的坎坷。 第一難：官方文檔搭不起項目 按照官方説明初始化項目：

前端

林恆 - 12個JS核心，搞懂這些直接起飛！

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 你是不是也遇到過這樣的場景？面試官拋出一個閉包問題，你支支吾吾答不上來；團隊代碼review時，看到同事用的Promise鏈一臉懵逼；明明功能實現了，性能卻總是差那麼一點... 別慌！今天我整理了12個JavaScript核心概念，這些都是2024年各大廠面試的高頻考點，也是日常開發中真正實用的硬核知識。搞懂它

前端

林恆 - 【Vue3】我用 Vue 封裝了個 ECharts Hooks

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 前言 在前端開發中，ECharts 作為數據可視化的利器被廣泛使用，但每次使用都要重複處理初始化、容器獲取、事件綁定、窗口 resize 等邏輯，不僅繁瑣還容易出錯。最近我封裝了一個useEchartHooks，徹底解決了這些痛點，今天就來分享一下實現思路和使用技巧。 為什麼需要這個 Hooks？

前端

林恆 - 前端技巧：檢測到省略號文本自動顯示 Tooltip

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 前言 在前端開發中，我們經常會遇到接口返回的文本內容過長，無法完全顯示的問題。為了處理這一問題，通常會設置固定的寬度並使用省略號樣式（text-overflow: ellipsis）來隱藏超出的文本。然而，有時產品需求還希望用户能夠通過懸停查看完整內容，這時就需要引入 Tooltip 進行展示。（沒被省略的時候不

前端

林恆 - 説一下 localhost 和127.0.0.1 的區別

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 localhost是主機名（域名） ，屬於應用層概念； 127.0.0.1是IPv4 迴環地址，屬於網絡層概念。 兩者都用於訪問本機服務，但localhost必須通過解析才能映射到具體 IP（默認是127.0.0.1或 IPv6 的::1），而127.0.0.1是直接的網絡層標識，無需解析。 一、本質定義與協

前端

林恆 - 神級JS API，誰用誰好用

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 1. ResizeObserver ResizeObserver 是一個瀏覽器原生的 JavaScript API，用於監聽 DOM 元素尺寸的變化。它類似於 MutationObserver，但專門用於觀察元素的大小（寬高）變化，而無需依賴 window.resize 事件（後者只對視口變化有效）。 🧩 基本用法

前端

林恆 - 在 Web 前端實現流式 TTS 播放

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 🧠 在 Web 前端實現流式 TTS 播放：從卡頓雜音到絲滑順暢的演進之路 在做前端實時語音合成（TTS）時，很多人都會遇到同樣的問題： 播放出來的語音一頓一頓的，很卡頓 聲音中夾雜“咔嗒”聲、雜音、斷裂 明明音頻格式是 MP3，也無法做到“接收到就播放” 本文將帶你走一遍真實的排坑過

前端

林恆 - 總結 Next.js 中的 Server Actions

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 我們知道，Next.js 最核心的特性便是 支持靜態生成（SSG）和服務端渲染（SSG），這也就意味着我們可以以部署 Node 服務的方式，將其部署在服務器上，用請求後端接口類似的形式來請求頁面文件。換句話説，我們其實可以直接把 Next.js 看成一個特殊的 Node 後端服務。 既然是在服務端進行運行，那麼它在數據庫

前端

林恆 - 使用自定義API接入OpenAI CodeX配置教程

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 Codex 是OpenAI 推出的一系列人工智能編碼工具，通過將任務委託給強大的雲端和本地編碼代理，幫助開發人員提升工作效率。支持原生終端、vscode插件、cursor插件等場景使用。 官網網站openai.com/codex/ 系統要求 步驟一：安裝Codex CLI 選擇一種安裝方式即可。 npm（通用） npm i

前端

林恆 - VUE3大屏自適應佈局

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 1. 視口單位佈局 (Viewport Units) 使用vw和vh單位來實現響應式佈局： .full-screen { width: vw(1920); height: vh(1080); padding: vh(5) vw(5) vh(5) vw(5); } .header-title { font-size

前端

林恆 - uni-app 無法實現全局 Toast？這個方法做到了！

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 大家好，我是不如摸魚去，wot-ui的主要維護者，歡迎來到我的 uni-app 分享專欄。 在 uni-app 開發中，我們經常遇到需要在任何地方（如網絡請求攔截器、路由守衞等）顯示 Toast 提示的需求。然而，uni-app 的組件化架構使得全局 Toast 的實現變得複雜。本文將介紹一套完整的解決方案，讓你輕鬆實現

前端