tag 前端

標籤
貢獻1,077
4612
06:37 AM · Oct 27 ,2025
smileZAZ 頭像 tuzixiansen_63d4d65909d62 頭像 qaz666 頭像 opentiny 頭像 invalidnull 頭像 dirackeeko 頭像 beishangdejianjidan_cqxuxf 頭像 yayu 頭像 junxiudetuoba 頭像 jdcdevloper 頭像 icecreamlj 頭像 xixindehongjiu 頭像

@前端 / 博客 RSS 訂閱

opentiny 頭像

OpenTiny社區 - Fluent Editor 富文本開源2個月的總結：增加格式刷、截屏、TypeScript 類型聲明等新特性

本文由體驗技術團隊Kagol原創。 Fluent Editor是一個基於 Quill 2.0 的富文本編輯器，在 Quill 基礎上擴展了豐富的模塊和格式，框架無關、 功能強大、開箱即用。 2024年8月12日，Fluent Editor 正式開源！ 源碼：https://github.com/opentiny/fluent-editor/ 官網：https://opentiny.gi

富文本編輯器 , 前端

收藏 評論

u_16213571 頭像

網絡安全專家 - JavaScript代碼性能優化總結 - ITer在路上的個人博客主頁 -

性能優化的核心目標 減少加載時間，提升執行效率，優化內存管理，改善用户體驗 代碼層面的優化 避免全局變量污染，減少作用域鏈查找 使用 const 和 let 替代 var，減少變量提升帶來的性能損耗 避免頻繁的 DOM 操作，使用文檔片段（DocumentFragment）或虛擬 DOM

性能優化 , 資源加載 , 內存管理 , 前端開發 , 前端 , Javascript

收藏 評論

xianyulee 頭像

閒人 - 利用webpack的 require.context api進行自動導入

require.context api及參數介紹 require.context(dir, useSubdir, regExp) 參數dir：用於動態加載的目錄 參數useSubDir：是否對dir指定的子目錄進行自動導入， type=boolean 參數regExp：匹配文件的正則表達式，可以在文件中加入特定的字符，按照特定的字符去加載對應的文件 eg: re

webpack , require , 前端

收藏 評論

liane 頭像

Liane - iconfont使用及webpack打包字體圖標

一、iconfont使用 官網：https://www.iconfont.cn/ 1、找到需要的icon圖標，添加至購物車 2、購物車中點擊添加至項目，可加入到GitHub的項目中,也可直接下載到本地 3、引用圖標 unicode引用 unicode是字體在網頁端最原始的應用方式，特點是： 兼容性最好，支持ie6+，及所有現代瀏覽器。 支持按字體的方式去動

iconfont , webpack , 前端

收藏 評論

tuzixiansen_63d4d65909d62 頭像

兔子先森 - Fetch+stream實現流式輸出

Fetch API 允許你跨網絡獲取資源，真正好的是，瀏覽器最近增加了將 fetch 響應作為可讀流使用的能力。 這是一個簡單明瞭的fetch+stream輸出的示例： try { // 定義手動停止接口 abortController.value = new AbortController(); // 發送請求 let response = await fetch(u

react , vue.js , HTML , 前端 , Javascript

收藏 評論

dushigemi 頭像

灬都是個謎 - vue3 模板編譯 —— 我竟把 v-if 和 v-for 的優先級改回來了，不信你看 🤣

📰 前言 眾所周知，在 vue3 中 v-if 總是優先於 v-for 生效。 然而，在某些情況下，我們可能更希望 v-for 的優先級更高， 雖然 vue3 並沒有提供直接修改指令優先級的方法，但是我們可以使用 AST（抽象語法樹） 轉換來實現這一點。 🌈 在線演示 📄 vite.config.ts import { defineConfig } from 'vite' im

vue.js , 編譯原理 , 前端

收藏 評論

smileZAZ 頭像

林恆 - 前端 HTML 轉 PDF

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

前端

收藏 評論

lneoi 頭像

LnEoi - 更安全的隨機數生成

Math.random() 通常情況下我們使用Math.random()來生成偽隨機數，在大部分情況下可以很方便的使用。比如 生成混合隨機字符 Math.random().toString(36).substr(2); 生成指定範圍的隨機數 const randomNumber = (min, max) = Math.floor(Math.random() * (max - min) + min)

隨機數 , 前端 , Javascript

收藏 評論

bianchengsanmei 頭像

編程三昧 - 前端 CSS 變量簡介及基本使用方法

背景 複雜的網站都會有大量的CSS代碼，通常也會有許多重複的值。 舉個例子，同樣一個顏色值可能在成千上百個地方被使用到，如果這個值發生了變化，需要全局搜索並且一個一個替換，效率不高且容易出錯。 自定義屬性在某個地方存儲一個值，然後在其他許多地方引用它。另一個好處是語義化的標識。比如，--main-text-color 會比 #00ff00 更易理解，尤其是這個顏色值在其他上下文中也被使用到。 概

css3 , css技巧 , css變量var , Css , 前端

收藏 評論

yilezhiming 頭像

以樂之名 - 前端進擊的巨人（六）：知否知否，須知this

常見this的誤解 指向函數自身（源於this英文意思的誤解） 指向函數的詞法作用域（部分情況） this的應用環境 1. 全局環境 無論是否在嚴格模式下，全局執行環境中（任何函數體外部）this都指向全局對象 var name = '以樂之名'; this.name; // 以樂之名 2. 函數（運行內）環境 函數內部，this的值取決於函數被調用的方式（被誰調用） var name

面試 , 進階 , 前端 , Javascript

收藏 評論

limingcan562 頭像

limingcan - 弄懂這幾個概念後，我對webpack有了新的理解

前言 隨着vite的誕生，webpack似乎漸漸的被大家拋棄。前陣子我也用vue@3.x + vite@4.x開發了一個後台管理系統，體驗了一把，確實有被vite飛快的啓動速度給驚豔到。 但是畢竟webpack已經誕生了許久，也經過市場的一些考驗，並且它有着豐富的插件，豐富的功能，一些大型的項目也使用過它，目前來説，它是一個相對於vite來説更穩定的打包工具。 基於以下原因： 有些公司由於歷史

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

收藏 評論

smileZAZ 頭像

林恆 - 手把手教你實現前端郵件預覽功能

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 你是否曾經想過，在瀏覽器中直接點擊一個郵件附件，就能預覽完整的郵件內容——包括髮件人、收件人、抄送、正文甚至內嵌圖片？ 今天，我們要揭秘一個基於 Vue 3 和 Vant UI 的郵件預覽上傳組件，它不僅能上傳.eml格式的郵件文件，還能在彈窗中完整渲染郵件內容，甚至支持附件圖片的內聯展示！

前端

收藏 評論

Reisentyan 頭像

粉紫系超人氣月兔鈴仙 - [vue3入門]HTML Learn Data Day 7

學習真的是一件很累的事情，更何況有這麼多雜七雜八的事情 唉唉，莎了我吧 原文章地址：https://www.cnblogs.com/Reisentyan/p/19656869 Vue3 構建 Vue3 每一次構建新項目時，都會從 npm 上拉取模板。 在 VS Code 中按： CTRL + ~ 打開終端，然後輸入： npm create vite@latest vue -- --t

前端

收藏 評論

lijinhuaboke 頭像

此顏差矣。 - Vue 3 + SVG ：打造動態交互式智慧公廁可視化大屏

🚀 Vue 3 + SVG ：打造“會呼吸”的智慧可視化大屏 在智慧城市建設的浪潮中，可視化大屏已成為展示數據的核心窗口。而在“智慧公廁”這一細分場景下，如何直觀、實時、高保真地展示每個廁位的佔用狀態（有人/無人），是前端開發中一個既有趣又充滿挑戰的課題。 傳統的做法往往是“切圖一把梭”——使用多張圖片進行絕對定位。但這種方式不僅適配性差（換個分辨率就由於），而且維護成本極高（加個廁位還得找 U

前端

收藏 評論

u_16213590 頭像

mob64ca13f9e726 - HTML循環創建div和table並實現滾動效果_html循環生成div

一、div列表滾動 現在需要實現一個效果，內容無限、平滑、無閃動地向上滾動；當鼠標懸停到列表時，滾動暫停並高亮當前項；鼠標移出後繼續滾動。這是在大屏項目中經常見到的一種展示數據的方式，本文為具體的實現方式。 實現原理： 在使用了js控制之後發現有閃動的現象，然後就換了種方式，我的想法是：把原始列表渲染兩次（A +

vue.js , 數據 , 後端開發 , 無縫滾動 , Css , harmonyos , 前端

收藏 評論

smileZAZ 頭像

林恆 - 探索JavaScript的秘密令牌：獨一無二的`Symbol`數據類型

🧑‍💻 寫在開頭 點贊 + 收藏 === 學會🤣🤣🤣 引言 在JavaScript的廣闊世界中，數據類型構成了其最基礎的語法元素。隨着ES6的發佈，這個大家庭迎來了兩位新成員：BigInt和Symbol。如果説BigInt是為了解決大數運算的精度問題，那麼Symbol的誕生，則像是一把為對象屬性開啓“隱私空間”和“唯一命名”的神奇鑰匙。本文將帶你深入理解這個“獨一無二”的簡

前端

收藏 評論

mark04 頭像

letier - Web 前端發展歷史以及未來的展望

Web 前端的發展歷史：從靜態頁面到現代工程化 前端開發（Front-End Development）是構建用户可見和交互界面的核心技術領域。自 20 世紀 90 年代萬維網誕生以來，Web 前端經歷了從簡單文本展示到複雜富應用的深刻變革。本文將系統梳理 Web 前端的發展歷程，分為五個主要階段，展現其技術演進與生態變遷。 一、第一階段：靜態網頁時代（1990s 初 — 2000 年前） 技術特

前端

收藏 評論

gqkmiss 頭像

月恆 - CSS 小技巧 —— CSS 實現 ... 的 loading 加載中動畫

CSS 小技巧 —— CSS 實現 ... 的 loading 加載中動畫 1. 前言 需求中想做出個這種效果，這個頁面又是一個單獨的 html 頁面，沒必要再單獨引入其他模塊了 就想着用 CSS 動畫來實現 2. 實現效果 3. 實現思路 3.1. 項目要求 ... 不能使所在的 dom 元素寬度變化，不然加個 . 變寬，少個點變窄，不好看 需要使用 animation 動畫的 infi

loading , css3 , css技巧 , Css , 前端

收藏 評論

u_17534189 頭像

qq68d2318712d49 - react實多併發請求同步處理封裝

在React中處理多併發請求並實現同步處理（如等待所有請求完成後再執行後續操作）是常見需求。以下是一個通用的多併發請求同步處理封裝方案，結合React的useEffect和Promise特性實現： 1. 核心封裝函數：處理多請求同步 /** * 同步處理多個併發請求 * @param {Array() = Promise} requestList - 請

封裝 , 數據 , Css , ios , 前端開發 , HTML , 前端

收藏 評論

winnn 頭像

Winn - 前端圖片壓縮上傳，減少等待時間！優化用户體檢

這裏有兩張圖片，它們表面看上去是一模一樣的，但實際上各自所佔用的內存大小相差了180倍。 可以看到右邊的圖片是22.3MB，而左側的圖片只有127KB，但是實際上這兩張圖片的大小都是22.3MB。 最近在開發中遇到這樣的一個需求，需要把用户上傳的圖片先進行一次壓縮，然後再保存到服務器，這裏我們除了優先考慮壓縮圖片的大小外，還要顧及圖片壓縮後的清晰度問題。 經過對比，圖片並沒有明顯的失真情況

設計模式 , 程序員 , 架構師 , 優化 , 前端

收藏 評論

shellingfordly 頭像

shellingfordly - 我的博客 3.0

前言 第一個博客是在大學時候弄的，用的是 hexo 搭建的。但是當時還是個小白，只在 github 上部署了打包後的代碼，沒有保存源代碼，導致後面我就再也沒更新過我的個人博客，一直停留在了 2019 年。後來有用 vuepress 搭建了一個學習筆記記錄的項目，但感覺不是很好看，沒有當主力的博客使用，之後就一直在掘金和思否上寫，就沒怎麼更新個人博客了。 由於今年上半年經常跑出去完，最近突然又想重新

博客搭建與配置 , 博客遷移 , 博客搭建 , 博客 , 前端

收藏 評論

showonne 頭像

Showonne - 面試官：HTTP/2 有什麼優點？別再説 Server Push 了

2022年8月18日，Chrome 開發團隊博客發佈了“Removing HTTP/2 Server Push from Chrome”一文，表示 Chrome 106 和之後的版本將默認禁用 HTTP/2 Server Push 特性 為什麼會被移除？ Server Push 允許網站主動推送頁面所需的資源，而不是被動等待。但實際上很難以此實現性能提升，所以用這個特性的人並不多，使用了 HTTP

http-2 , 前端

收藏 評論

jimodetiebanshao 頭像

UXbot - 2026年 UI 設計平台價值洞察與選型指南

AIGC 設計平台正深度重塑設計師、產品經理及創意從業者的工作範式。相較於傳統工具，此類平台基於自然語言與極簡指令，即可實現視覺設計、UI 原型、圖形內容的自動化生成，顯著提升生產效率，大幅壓縮重複性勞動佔比。本文精選 6 款優質 AIGC 設計平台，覆蓋原型設計、圖形創作、視覺內容生成等核心場景，助力從業者精準匹配工作流程，依託 AI 技術實現創意從構思到成果的高效轉化。 UXbot：全流程

vue.js , 產品經理 , 原型 , 程序員 , 前端

收藏 評論

u_16213724 頭像

mob64ca141a2a87 - css 右對齊_Web前端教程：簡單實用的CSS網頁佈局中文排版技巧_weixin

不管你怎麼換字體、調字距，都達不到那種自然的效果。這其實不是你的鍋，也不是設計師的問題——而是瀏覽器長期沒有正確處理中文與西文混排的間距。在中文網頁排版的世界裏，這個問題已經困擾了我們很多年。 如果你經常寫內容類應用，一定有過這樣的困惑： 為什麼中文和英文、數字混在一起，總是看起來那麼彆扭？ 比如「我愛Vue」、「版本2.0」，這些混排的文字總顯得擠在一起、不太

人工智能 , Css , ci , 前端開發 , HTML , 前端

收藏 評論