收藏 / 列表

amejimaobari-ollornwi 頭像

Amejimaobari Ollornwi - Handling JavaScript Event Listeners With Parameters

JavaScript event listeners are very important, as they exist in almost every web application that requires interactivity. As common as they are, it is also essential for them to be managed properly.

Techniques , coding , Javascript

linx 頭像

前端路引 - Web前端入門第 83 問：JavaScript localStorage 有大小限制嗎？溢出會怎樣？

本地存儲除了 Cookie 外，還有 localStorage 和 sessionStorage，本文一探 localStorage。 localStorage 此 API 存入的數據會 永久 保存在瀏覽器中，除非用户手動刪除。 localStorage 能用於同一瀏覽器同一域名跨標籤頁通信。 同一瀏覽器無痕模式和非無痕模式下，localStorage 存儲的數據無法互通，且無痕模式存入的數據在瀏

前端 , Javascript

hsr2022 頭像

後山人 - 為什麼 PHP 依然有如此龐大的用户羣？——技術選擇背後的商業邏輯與進化

為什麼 PHP 依然有如此龐大的用户羣？——技術選擇背後的商業邏輯與進化 摘要 儘管每年都有“PHP 已死”的論調出現，但數據顯示，PHP 依然是互聯網上使用最廣泛的服務器端編程語言之一。根據 W3Techs 的統計，截至 2024 年，超過 75% 的網站在使用 PHP [1]。 PHP 的持續流行並非偶然，它是技術進化、商業成本、成熟生態和開發效率共同作用的結果。本文將從四個核心維度，結合 鋭

vue.js , php , Javascript

kestrel_task 頭像

微芒不朽 - Linux 服務器磁盤滿了？教你快速找到大文件，安全刪掉不踩坑！

1. 磁盤空間檢查基礎命令 1.1 查看磁盤使用情況 # 查看所有掛載點的磁盤使用情況 df -h # 查看指定目錄的磁盤使用情況 df -h /home 1.2 查找大文件和目錄 # 查找當前目錄下大於100MB的文件 find . -type f -size +100M -exec ls -lh {} \; # 查找根目錄下大於1GB的文件 find / -type f -size +

Linux

dirackeeko 頭像

DiracKeeko - [axios] 實現頁面級批量取消請求

在請求發送階段(未取得返回結果時)，前端(瀏覽器)取消請求，捕獲該狀態，並做異常攔截處理。 思路: 1、記錄每個請求的cancelToken。 2、在頁面路由更新時(從頁面A進入頁面B時)取消A頁面未完成的請求。 3、把"取消請求"的異常狀態做一個特殊的異常標記。 4、全局請求攔截器對這種特殊的異常標記做靜默處理。 代碼實現: 1、全局的請求實例攔截器中，增加配置，通

Axios , 前端

apifox 頭像

Apifox - 從零開始掌握 API Token：簡單入門

我們都知道，API（應用程序編程接口）是一個至關重要的概念，它允許不同軟件系統之間進行通信和數據交換。無論是移動應用與服務器的通信、Web 應用後端與前端的交互，還是複雜後台服務之間的協同工作，API 都是基礎。然而，在 API 的使用過程中，安全性是必須考慮的重要方面。為了實現這一點，我們需要一種機制來驗證和授權每個 API 請求的合法性，API Token 就在此扮演了關鍵角色。 API To

API , token , 程序員 , 後端 , 前端

yinzhixiaxue 頭像

銀之夏雪 - CSS 真的會阻塞文檔解析嗎？從瀏覽器渲染原理深入探究一下

在網頁開發領域，一個常見的疑問是 CSS 是否會阻塞文檔解析。理解這一問題對於優化網頁性能、提升用户體驗至關重要。要深入解答這個問題，需要從瀏覽器渲染網頁的原理説起。 瀏覽器渲染網頁的基本流程 瀏覽器在接收到 HTML 文檔後，會依次進行以下幾個主要步驟： 解析 HTML：瀏覽器從網絡或本地獲取 HTML 文件，然後開始解析，將 HTML 代碼轉換為 DOM（Document Object M

瀏覽器 , 瀏覽器原理 , Css , 前端 , Javascript

linong 頭像

linong - 使用 Cursor 修復 Ant Design Pro Components 的 issues

Issue: 🐛 ModalFrom在同時設置了formRef、request和destroyOnClose時，加載過程中關閉ModalForm會報錯 #8858 PR: https://github.com/ant-design/pro-components/pull/9272 最近有個小夥伴在做穩定性建設，整理了一下現有的線上報錯，其中有一個 form.resetFields is n

react , ant-design , typescript , 前端 , Javascript

ruochuan12 頭像

若川 - 50行代碼串行Promise，koa洋葱模型原來是這麼實現？

1. 前言 大家好，我是若川。歡迎關注我的公眾號若川視野，最近組織了源碼共讀活動《1個月，200+人，一起讀了4周源碼》，感興趣的可以加我微信 ruochuan12 參與，長期交流學習。 之前寫的《學習源碼整體架構系列》 包含jQuery、underscore、lodash、vuex、sentry、axios、redux、koa、vue-devtools、vuex4十餘篇源碼文章。其中最新的兩篇是

node.js , koa , koa.js , 前端 , Javascript

_607c00baa52ff 頭像

懟懟 - 【js】實現繼承的幾種方式

js繼承 原型鏈 構造函數 組合繼承(原型鏈 + 構造函數) 原型式繼承 寄生式繼承 寄生組合繼承 1.原型鏈繼承 將父類的實例作為子類的原型 //父類 function School(name) { //實例屬性 this.name = name || "父類" this.arr = [1] } //父類原型方法 School.prototype = {

繼承 , Javascript

zisrfs 頭像

zsirfs - 深入一點 - 為什麼説splice 效率低呢

原文: https://zswfx.com/articles/5da713302ddd022595ff506a 我們在使用 Array.prototype.splice 方法的時候，都會提及説它速度慢，效率低。尤其在例如 Vue或者React 框架中也不推薦使用，原因是為什麼呢？ splice 方法 方法介紹如下: 方法也比較明瞭，就是在數組內刪除或者添加元素。 如下示例: // 添加一個

javascript專題系列 , Javascript

hai2007 頭像

你好2007 - v-solt 插槽（基礎使用、具名插槽、作用域插槽等）

基本使用 組件通過slot預留位置，使用組件的時候，可以通過傳遞具體的內容去替換slot佔用的地方，這就是插槽。 比如現在定義了一個組件： !-- simple-use.vue -- template div slot/slot /div /template 組件slot/slot佔用的位置具體內容不確定，需要使用的時候傳遞進來，我們就可以這樣使用： simple-use em

vue.js , htm , template.js , 前端 , Javascript

zhuifengdekukafei 頭像

追風的苦咖啡 - 加密0延遲，敏感信息秒穿防火牆

加密0延遲，敏感信息秒穿防火牆 在數字經濟時代，數據就是企業的血脈。當業務流轉、遠程協作成為常態，如何在保障數據安全的前提下，實現高效無阻的信息通道，成為了困擾無數企業的核心難題。傳統的安全觀念似乎總在“安全”與“效率”之間劃上等號，讓企業在加密傳輸面前，不得不忍受延遲和卡頓的代價。 然而，技術的進步正在顛覆這一固有認知。以SSL/TLS證書為核心的新一代加密解決方案，已經能夠實現“零感知”的即時

safari , 資訊 , tailwind-css , 教程 , 知識

shimiandeshatanku 頭像

李遊Leo - 深入理解 ECMAScript 2024 新特性：正則表達式 /v 標誌

ECMAScript 2024 （ES15）標準引入了新的正則表達式標誌 /v，這一新增功能不僅優化了多行匹配的處理，還增加了對特殊字符匹配的支持。這一變革對於需要處理複雜文本數據的應用場景尤為重要，比如日誌分析、代碼審核等。接下來，本文將深入探討 /v 標誌的實際應用價值，並通過多個編程案例來展示其強大的實際應用能力。 /v 標誌的技術背景與應用 正則表達式作為開發者的有力工具，經常被用於字符

ecmascript , Javascript

nanchengfe 頭像

南城FE - 前端如何徹底解決重複請求問題？看看這5種方案

在前端開發中，重複請求是一個常見且棘手的問題。比如用户快速點擊"保存"按鈕導致生成多條重複單據，或者列表頁頻繁刷新造成服務器壓力飆升，這些場景不僅影響用户體驗，還可能引發數據一致性問題。本文將系統梳理重複請求的解決方案，從基礎到進階進行對比分析，並結合實際代碼案例解決這一痛點。 一、重複請求不止是"多花錢" 在討論解決方案前，我們先明確重複請求的具體影響，避免因"覺得問題不大"而忽視它： 數據

前端 , Javascript

beckyyyy 頭像

beckyyyy - 給web增加簡單的ai對話功能

自從 ChatGPT 火了之後，越來越多人開始對 AI 感興趣，AI 的使用也越來越普遍了。現在你隨便點開個知名網站或者 APP，基本都能看到 AI 的影子，而且這些 AI 大多都是用 “問答” 的形式跟人互動，説白了就是 “聊天”。 當然啦，現在的 AI 也不是完美的，比如有時候會瞎編東西（就是大家説的 “AI 幻覺”），但給 APP 加個 AI 功能，確實能讓它變好玩、互動感更強。那咱們

通義千問 , 人工智能 , 前端

ning_643b67be37ac3 頭像

麒寧 - Ant Design 常見用法與坑點總結（一）

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

form , 表單驗證 , antd , 前端 , Javascript

cloudyttt 頭像

雲魚 - 深入瞭解瀏覽器渲染進程的工作方式

你是否曾經好奇過瀏覽器是如何渲染網頁的？本文將通過 30 張圖將帶你瞭解瀏覽器渲染進程的內部工作機制。 渲染進程負責處理標籤頁中的所有內容。 在渲染進程中，主線程處理大部分發送給用户的代碼。如果使用 Web Worker 或 Service Worker，部分 JavaScript 會由工作線程處理。另外，合成器線程和光柵化線程也在渲染進程中運行，確保網頁高效、流暢地渲染。 渲染進程的核心任務是將

性能優化 , 面試 , 瀏覽器原理

u_17350491 頭像

轉角處的湯姆 - 深入理解 JSS：現代化的 CSS-in-JS 解決方案

引言 在現代前端開發中，CSS-in-JS 是一個越來越流行的概念。隨着 React 和其他前端框架的崛起，傳統的 CSS 方法逐漸顯得不夠靈活和高效。JSS（JavaScript Style Sheets）作為一種 CSS-in-JS 解決方案，提供了更靈活、更強大的方式來管理組件樣式。本文將深入探討 JSS，介紹其工作原理、優勢，以及如何在項目中有效使用它。 什麼

類名 , Css , 開發者 , 前端開發 , Javascript

gqkmiss 頭像

月恆 - React Vite 項目增加 eslint 和 prettier

React Vite 項目增加 eslint 和 prettier Eslint 版本為 8.X 1. 安裝 8.X 版本的 eslint pnpm i eslint@^8.57.0 -D 2. 安裝其他包 pnpm add -D eslint-plugin-import prettier eslint-plugin-react eslint-plugin-react-hooks esli

react , eslint , prettier , 前端

u_17072679 頭像

前端小巷子 - 深入 Vue 的 nextTick

深入 Vue 的 nextTick 在初學 Vue 時，我們經常會遇到這樣的困惑：數據明明已經改了，可頁面卻沒立刻變化；或者手動去獲取更新後的 DOM，結果拿到的是舊值。這時候，Vue 官方會推薦我們使用 this.$nextTick()。它到底做了什麼？為什麼“等一下”就能解決問題？本文嘗試用通俗的語言把它的作用和實現原理講清楚。 一、nextTick 的作用 Vue 的響

事件循環 , 重繪 , Vue , 前端開發 , Javascript

grewer 頭像

Grewer - 淺析微前端沙箱

前言 在大型項目中，微前端是一種常見的優化手段，本文就微前端中沙箱的機制及原理，作一下講解。 首先什麼是微前端 Techniques, strategies and recipes for building a modern web app with multiple teams that can ship features independently. -- Micro Frontends

iframe , qiankun , 微前端 , 前端 , Javascript

momeak9 頭像

泯瀧 - Web Woker 與主線程通信場景下對postMessage的簡潔封裝

在Web Worker與主線程之間進行通信時，使用postMessage是一種常見的方式。然而，在某些業務場景中，postMessage可能會顯得不夠簡潔，因為它涉及到手動序列化和反序列化數據，以及通過事件監聽器處理消息。以下是一些常見問題和解決方案，以簡化在Web Worker與主線程之間的通信場景中使用postMessage的問題。 結構化克隆問題 在Web Worker與主線程之間傳輸數據時

瀏覽器 , webworker , 瀏覽器原理 , 前端 , Javascript