收藏 / 列表

wupeng_5a4de5c290b9d 頭像

PatWu16 - chrome-devtools-mcp 工具試用記錄

谷歌 Chrome 開發者工具 MCP 服務器公佈，它允許 AI 代理在瀏覽器中直接調試、測試和修復代碼，彌補了以往 AI 編碼工具無法直接觀察代碼在瀏覽器中運行情況的缺陷，更多內容查看官方博客、Github倉庫，其在發佈的短時間內即引起廣泛關注，npm下載量陡升： 調試工具提供的能力： 試用記錄，僅供參考：   

chrome-devtools , 前端

skychx 頭像

鹵代烴 - ⚡️ [性能優化] 瀏覽器是如何用 HTML Preload Scanner 偷偷優化資源下載的

如果你喜歡我的文章，希望點贊👍 收藏 📁 評論 💬 三連支持一下，謝謝你，這對我真的很重要！ 大家好，我是專注於做性能優化的鹵代烴。 做網頁相關的性能優化時，需要對瀏覽器的底層原理有一定的瞭解，這樣才能更好的讓頁面走在 happy path 上。今天我們就瞭解一個很少被人所知的瀏覽器默認性能優化方案 —— HTML Preload Scanner，看看它是如何優化網絡資源加載速度的。 瀏覽器

性能優化 , chrome , 瀏覽器原理 , 前端

qifengliao_5e7f5b20ee3bd 頭像

起風了 - 如何快速查看頁面的佈局結構？

在前端頁面 UI 開發時，如何能快速查看頁面的結構佈局？ html * { outline: 1px solid red !important; } outline 屬性不會增加元素的尺寸，比 border 要好。

佈局 , css3 , Css , 前端 , ui

limingcan562 頭像

limingcan - 有了這些方法，webpack你也可以自己配

前言 通過上篇文章——弄懂這幾個概念後，我對webpack有了更新的理解 的講解，我們大致瞭解了： 使用webpack過程中出現的一些概念 結合打包過程中出現的概念，淺析了webpack打包流程，讓大家對打包流程有個大致的理解 我們都知道，我們在實際開發過程中，使用webpack無非就是為了最後輸出瀏覽器能運行的css、img、js、html等前端資源。 那麼，為了更貼近實際，我們這篇文章

構建工具 , webpack5 , challenge , 前端 , Javascript

yangyaya 頭像

陽呀呀 - “寒冬”三年經驗前端面試總結（含頭條、百度、餓了麼、滴滴等）之手寫題（promise篇）

前言 不論是寒冬還是暖冬，找工作之前都需要做好充足的準備，面試的時候才能做到遊刃有餘。此文是把我最近找工作準備的以及筆試面試中涉及到的手寫題做一個總結。給自己，也給需要的同學。 手寫題是比較好準備的一個環節，大部分公司考察的題也就那麼多，大都不會超出範圍。 本篇主要涉及promise相關的題目。 往期： "寒冬"三年經驗前端面試總結（含頭條、百度、餓了麼、滴滴等） "寒冬"三年經驗前

面試 , 筆試 , 前端 , Javascript

huobaodejianpan 頭像

火爆的鍵盤 - Windows 如何使用 cURL 命令？基礎入門

在工作流程中，為了快速驗證 API 接口有效性，團隊成員經常轉向直接執行 cURL 命令的方法。這種做法不僅節省時間，而且促進了團隊效率的提升。對於使用 Windows 系統的用户來説，這裏有一套詳細的操作指南來執行 cURL 命令。 檢查 Windows 系統的 cURL 環境 Windows 系統默認情況下應該已經安裝了 cURL 環境。可以通過快速的步驟來驗證：按下Win + R鍵，輸入cm

JAVA , curl , 程序員 , 後端

webinfoq 頭像

破曉L - 面試小冊：面試官經常問的十個棘手的 JavaScript 問題

1. 可變性 在 JavaScript 中有七種基本數據類型（string、number、boolean、undefined、symbol、bigint 和 null），這些都是不可變的。這意味着一旦分配了一個值，我們就無法修改它們，我們可以做的是將它重新分配給一個不同的值（不同的內存指針）。另一方面，其他數據類型（如 Object 和 Function）是可變的，這意味着我們可以修改同一內存指

原型 , 閉包 , 面試問題 , 前端 , Javascript

huashenjianlingshouhuni 頭像

zhanle_huang - 一張base64圖片格式的圖片，將其轉化成blob然後上傳到服務器

一張base64圖片格式的圖片，將其轉化成blob然後上傳到服務器 需求描述 一張base64圖片格式的圖片，將其轉化成blob然後上傳到服務器，後台跟接收表單文件上傳一樣的方式去處理改圖片 實現 // url 表示base64的字符串， name表示文件名，附加到blob上的那麼、上 uploadFile(url, name) { // 以逗號劃分類型和內容

base64 , blob , HTML , 前端 , Javascript

hai2007 頭像

你好2007 - 從vue-loader開始理解webpack的一些設計思想

寫在前面 為了更好的説明，我們模仿Vue.js開發了一個類似的簡化版本的前端框架Quick Paper(文檔) 來幫助你理解一些細節。因此在開始之前，讓我們先大致瞭解一下此項目的結構，方便後續描述。 温馨提示：我們推薦你在開始之前去Github上把此項目clone下來後，對照着源碼進行學習！ 目錄結構 其實你只需要關注下面四個文件夾： src：框架源碼； loader：類似vue-loade

vue-loader , vue.js , loader , webpack , Javascript

hellotech 頭像

哈囉技術 - 基於定位的出發地異常問題治理

前言 哈囉作為一家出行互聯網公司，定位這種基礎能力是深度融入在各業務的核心鏈路中的，筆者所在的地圖團隊經常會收到定位相關的badcase，但苦於定位的複雜與較難回收出價值，一直沒有針對性去解決此類問題，那在各大互聯網廠商都在做下沉市場注重用户體驗的今天，我們重新撿起了這個話題。 問題梳理 無位置 由於APP啓動時未獲取到位置，會給用户提示並阻塞發單，用户需要使用POI搜索或拖動地圖的方式選擇出發地

地圖 , 前端

kagol 頭像

Kagol - 🥳重磅更新！Fluent Editor 開源富文本支持 LaTeX 可編輯公式啦~

你好，我是 Kagol，個人公眾號：前端開源星球。 Fluent Editor 是一個基於 Quill 2.0 的富文本編輯器，在 Quill 基礎上擴展了豐富的模塊和格式，框架無關、功能強大、開箱即用。 源碼：https://github.com/opentiny/fluent-editor/（歡迎 Star ⭐） 官網：https://opentiny.github.io/fluent-

富文本編輯器 , 開源 , 前端

changlina 頭像

長林啊 - 掌控 React 表單：詳解受控組件和非受控組件

大家好，我是長林啊！一個愛好 JavaScript、Go、Rust 的全棧開發者；致力於終生學習和技術分享。 本文首發在我的微信公眾號【長林啊】，歡迎大家關注、分享、點贊！ 在開發過程中，經常涉及到用户輸入的表單處理；表單可以分為兩種類型：受控表單（Controlled Components）和非受控表單（Uncontrolled Components）。這兩種表單在處理用户輸入和狀態管理時有着不

react , web開發 , next.js , 全棧開發者

codechen8848 頭像

codechen8848 - 免費高顏值！一款跨平台桌面端視頻資源播放器！

大家好，我是 Java陳序員。 今天，給大家推薦一款跨平台的桌面端視頻播放器，免費高顏值！ 關注微信公眾號：【Java陳序員】，獲取開源項目分享、AI副業分享、超200本經典計算機電子書籍等。 項目介紹 ZyPlayer —— 一款免費易用且打造的全功能媒體播放器，基於 electron-Vite 框架，結合 TDesign 組件庫和 Vue3 全家桶，致力於提供流暢、高效的跨平台娛樂體驗。

前端

aipaobudefanqie 頭像

愛跑步的番茄 - 什麼是住宅代理（Residential Proxy）？詳解原理、優勢與應用場景

在數字經濟與跨境互聯網時代，網絡訪問安全與數據合規成為企業關注的核心。而“住宅代理”（Residential Proxy）作為一種高匿名、高穩定的網絡中轉方式，正成為營銷、數據採集與賬號管理領域不可或缺的技術基礎。 本文將深入解析住宅代理的概念、工作原理、與數據中心代理的區別，以及它在實際業務中的典型應用場景。 一、住宅代理的定義 住宅代理（Residential Proxy） 是指通過真實

typescript , 前端 , Javascript

dianliangxiaocheng_19854189632 頭像

點量實時雲渲染 - Tizen版應用上架三星商店，海外OTT/IPTV系統實現全平台覆蓋新突破

近日，一套為海外視頻運營商定製的Tizen版OTT/IPTV影音系統應用APP，已通過三星官方審核，並在Samsung Smart TV應用商店正式上架。此舉標誌着該運營商的影音服務已全面覆蓋iOS、Android、Android TV及Web等主流平台，完成了全球智能電視生態的關鍵佈局。 一、合作背景：從單點部署到全平台生態的構建 該海外視頻運營商在當地市場擁有廣泛的用户基礎。在長期的數字化升

資訊 , Android , ios , 後端 , 前端

yinzhixiaxue 頭像

銀之夏雪 - 從底層到實踐：深度解析 Vue Composition API 與 React Hooks 的異同

一、設計哲學與底層原理差異 1.1 響應式系統的基因差異 Vue3 的 Composition API 建立在 Proxy-based 響應式系統之上，通過劫持對象的 getter/setter 實現依賴收集。當訪問響應式對象時，Vue 會自動建立組件與數據的依賴關係。 // Vue 響應式原理簡版實現 function reactive(obj) { return new Proxy(obj

react , vue.js , react-hooks , vue3 , 前端

ning_643b67be37ac3 頭像

麒寧 - Ant Design 常見用法與坑點總結（二）：Form 表單下拉框設置初始值

前言 Ant Design 是螞蟻出品的出色優秀的 React 組件庫，相信使用 React 進行管理系統開發的小夥伴們或多或少都接觸過 Ant Design。很多公司基於 React 開發的管理端系統也都是使用 Ant Design 的組件庫。 因此，瞭解 Ant Design 的常見用法與坑點還是有必要的。 本系列文章針對 Ant Design 一些官方文檔雖有提及，但是容易被忽略的，又比較重

antd , select , antd-mobile , 前端 , Javascript

tanking 頭像

TANKING - 本地使用PaddleOCR進行圖片識別獲得文字（返回JSON）

優點 ✅ 識別率高，支持繁簡中文和手寫識別 ✅ 支持角度檢測，避免文字方向影響識別效果 ✅ 還能識別表格、票據等複雜場景 方法 pip install paddleocr pip install paddlepaddle （如果你有 GPU，可以安裝 paddlepaddle-gpu 以加速識別） 使用示例 from paddleocr import PaddleOCR ocr =

圖片識別 , paddleocr , 圖片處理 , ocr , Python

jackysummer 頭像

JackySummer - 完全搞懂 BFC

什麼是 BFC BFC 全稱是 Block Formatting Context，即塊格式化上下文。 除了 BFC，還有： IFC（行級格式化上下文）- inline 內聯 GFC（網格佈局格式化上下文）- display: grid FFC（自適應格式化上下文）- display: flex或display: inline-flex 注意：同一個元素不能同時存在於兩個 BFC 中 它是

bfc , Css

powerful_simon 頭像

小謳 - 《javascript高級程序設計》學習筆記 | 11.1.異步編程

關注前端小謳，閲讀更多原創技術文章 異步編程 ES6 新增了正式的Promise引用類型，支持更優雅地定義和組織異步邏輯 接下來的幾個版本，使用async和await關鍵字定義異步函數的機制 相關代碼 → 同步與異步 同步行為在內存中順序執行處理器指令 每條指令都在單個線程中按出現順序執行 每條指令執行後，都可以推斷出程序的狀態，並立即獲得存儲在系統本地（

settimeout , 異步編程 , 前端 , Javascript