tag 前端

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

@前端 / 博客 RSS 訂閱

yunzhihuijishushequ 頭像

雲智慧 - 前端架構三大巨頭之一 Angular | 深度講解

雲智慧集團成立於2009年，是全棧智能業務運維解決方案服務商。經過多年自主研發，公司形成了從IT運維、電力運維到IoT運維的產業佈局，覆蓋ITOM、ITOA、ITSM、DevOps以及IoT幾大領域，為金融、政府、運營商、能源、交通、製造等上百家行業的客户，提供了數字化運維體系建設及全生命週期運維管理解決方案。雲智慧秉承Make Digital Online的使命，致力於通過先進的產品技術，為企業

angularjs , angular , 大前端 , 開源 , 前端

收藏 評論

hello888 頭像

洛陽醉長安行 - 【從實戰帶你認識gulp】打包前端項目並實現防緩存

gulp是什麼？ 一個基於node的前端自動化任務構建工具，使用經典回調+鏈式調用的方式實現任務的自動化 (src.pipe(...).pipe)，gulp其實和webpack很相似，但是gulp側重點不同，gulp更側重前端流程自動化、任務執行（通過任務使開發提效），就像一條流水線。而webpack則是更側重用於打包前端資源，一切皆可打包成模塊。 官方文檔：https://www.gulp

gulp , 前端 , Javascript

收藏 評論

fengkuangdejinju 頭像

瘋狂的金桔 - 瀏覽器的進程和線程

瀏覽器的進程和線程 前言   要理解瀏覽器的進程和線程，首先需要理解一句話：進程是CPU分配資源的最小單位，線程是CPU調度的最小單位。   應用程序在運行時，CPU會分配一塊可獨立運行的內存，即進程，他是應用程序運行的載體。進程一般由程序，數據集合和進程控制塊三部分組成。程序用於描述進程要完成的功能，是控制進程執行的指令集；數據集合是程序在執行時所需要的數據和工作區；程序控制塊包含進程的描述信息

瀏覽器 , 進程 , 線程 , 前端

收藏 評論

asmallwhitecat 頭像

華仔 - 【包真】我的第一次webpack優化，首屏渲染從9s到1s

大家好，我是貓小白，本文基於vue2，全文閲讀大約需要3分鐘。 談到webpack優化大部分人可能都看膩了，無非就那幾招嘛，我之前也是看過許多類似的文章，但都沒有自己真正上手過，下面是我用公司的項目真實操練下來的，首屏加載速度提升很大（刷刷的），希望能幫到你。 廢話不多説，先看看對比成果！ 類型 優化前 優化後 js文件大小

前端優化 , webpack , 前端 , Javascript

收藏 評論

qiuzhisijiaoniannian 頭像

前端私教年年 - 最後一次，搞懂CSRF攻擊！

完整閲讀本文大約需要5分鐘。 開始閲讀之前，先上一道面試題： CSRF攻擊和XSS攻擊之間，有什麼聯繫？ 什麼是CSRF攻擊 CSRF攻擊即Cross-site request forgery，跨站請求偽造，直白來説就是惡意網站偽裝成用户，向被害網站發起操作請求。 為了方便理解，做了一張圖，攻擊流程如下： 用户登錄受害網站，瀏覽器把獲取的身份憑證保存在本地cookie中； 用户被誘導打開黑

網絡安全 , 面試 , csrf , 後端 , 前端

收藏 評論

kinglisky 頭像

臼犀 - JSON-RPC & postMessage 談談瀏覽器消息通信的封裝技巧

楔子 postMessage 常見於內嵌 iframe 或是 Web Workers 中，用於跨頁面（線程） 的消息通信，在一些其他開發環境中也能看到類似的影子，如 Chrome 插件環境、Electron 環境、figma 插件等。 最近的工作需要經常與 iframe 與 Web Workers 打交道，處理頁面與內嵌頁、主線程與 worker 通信，擼了個用於處理瀏覽器消息通信的處理的工具庫

json-rpc , webworker , postmessage , typescript , 前端

收藏 評論

invalidnull 頭像

註銷 - SAP 電商雲 Spartacus UI 裏的 Content Security Policy

內容安全策略(Content Security Policy，簡稱 CSP)是一種工具，允許開發人員指定在通過 Web 瀏覽器訪問 Storefront 頁面時允許加載哪些位置和哪些類型的資源。 可以使用內容安全策略來鎖定店面應用程序，並降低內容注入漏洞的風險，例如跨站點腳本 (XSS)、代碼注入和點擊劫持攻擊(clickjacking)，以及降低您的店面應用程序執行的權限。 Target Pol

node.js , sap , spa , 前端 , Javascript

收藏 評論

lewyon 頭像

程序猿布歐 - javascript基本數據類型和對象類型歸檔

javascript的基本數據類型以及引用數據類型，基本數據類型在開發中經常會用到，包括作為變量使用，判斷數據類型來處理一些業務等 基本（簡單數據類型） undefined,Null,Boolean,Number,String 複雜的數據類型Object undefined undefined 類型只有一個值，即它本身，在使用var聲明變量但未給初始值時，這個變量的值為undefine

ecmascript , 前端 , Javascript

收藏 評論

lewyon 頭像

程序猿布歐 - 前端（react）上傳到阿里雲OSS存儲 實例

需求背景 由於現有的後台管理系統，上傳的視頻越來越大，加上上傳視頻較慢，後端小哥提出直接從前端上傳視頻或者其他文件到阿里雲OSS存儲。 阿里雲OSS 阿里雲OSS文檔介紹，這裏不做過多贅述 安裝 原本在最開始的時候，是使用node版本的SDK，最開始使用的[nodejs版本] 代碼如下 async function put() { try { let result

react , 阿里雲oss , ecmascript , 前端 , Javascript

收藏 評論

fisher_feng 頭像

馮諾依曼的馮 - TypeScript基本類型有哪些

ts編譯成js的工具 npm install -g typescript 使用命令： tsc example.ts 只執行ts代碼，但不編譯的工具 1、nodemon , 只要保存代碼就會執行,比較推薦 安裝：``` npm intall -g nodemon ``` 使用： ``` nodemon example.ts ``` 2、ts-node ,每次需要執行ts-node命令 安裝

angularjs , react , vue.js , typescript , 前端

收藏 評論

kestrel_task 頭像

微芒不朽 - 【nodejs進階之旅(2)】:使用koa2+mysql 實現列表數據分頁

1.展示效果（分頁） 2.分頁主要字段 分頁主要字段包括 pageSize 每頁條數、pageNum 第幾頁、startRow 當前開始頁編號、endRow 當前結束頁編號、total 總數量。主要是根據前端分頁的參數，進行處理後，返回前端正確的數據，其實是一個很常見且簡單的功能。但是是非常也是非常重要的。 pageSize 每頁條數 pageNum 第幾頁 startRow 當前開始頁編號

vue.js , koa2 , node.js , 前端 , Javascript

收藏 評論

morimanong 頭像

末日碼農 - 用 rollup + gulp 造個輪子，別説還挺香

前戲 我是16年入了前端的坑，17年知道了gulp和rollup這兩個玩意兒。由於那時webpack勢頭很猛，便一直沒有正眼瞧過它一眼。 直到20年進了一家小公司，做了很多類似的小項目，相同的代碼拷來拷去，出現一個bug一堆項目都要改，實在噁心到我了。 於是不得不開始考慮將一些公共的方法和組件提取出來，做成一個第三方庫來維護。而在庫的封裝方面，rollup相對於webpack具有一定的優勢。 在此

gulp , rollup , typescript , 前端 , Javascript

收藏 評論

xiangjiaochihuanggua 頭像

香蕉吃黃瓜 - 理解為什麼要給useEffect聲明依賴

在使用useEffect、useCallback這些hooks，為什麼還要寫依賴數組呢，不寫這些依賴，React還給你警告。 下面我就來分享一下自己的理解 聲明依賴的目的：防止函數的閉包特性產生意外的錯誤 前言 在b站看到一個up用JS實現紅綠燈，我就試着自己也寫一個。 目的是想要它每個1秒跳轉到下一個燈。 紅 = 綠 = 黃 = 紅 = 綠 = 黃 這樣的順序 代碼 但是

react , 閉包 , 前端

收藏 評論

johanazhu 頭像

山頭人漢波 - Koa2從零到腳手架

什麼是 Koa2 由 Express 原班人馬打造的新生代 Node.js Web 框架，它的代碼很簡單，沒有像 Express 那樣，提供路由、靜態服務等等，它是為了解決 Node 問題（簡化了 Node 中操作）並取代之，它本身是一個簡單的中間件框架，需要配合各個中間件才能使用 文檔 中文文檔 (野生) 最簡單的 Koa 服務器 const Koa = require('koa') cons

koa2 , node.js , 前端

收藏 評論

johanazhu 頭像

山頭人漢波 - 從淺入深瞭解Koa2源碼

在前文我們介紹過什麼是 Koa2 的基礎 簡單回顧下 什麼是 koa2 NodeJS 的 web 開發框架 Koa 可被視為 nodejs 的 HTTP 模塊的抽象 源碼重點 中間件機制 洋葱模型 compose 源碼結構 Koa2 的源碼地址：https://github.com/koajs/koa 其中 lib 為其源碼 可以看出，只有四個文件：application.js、cont

koa2 , node.js , 源碼分析 , 前端 , Javascript

收藏 評論

johanazhu 頭像

山頭人漢波 - 一步一步來：手寫Koa2

之前講過Koa2從零到腳手架，以及從淺入深瞭解Koa2源碼 這篇文章講解如何手寫一個 Koa2 Step 1：封裝 HTTP 服務和創建 Koa 構造函數 之前閲讀 Koa2 的源碼得知， Koa 的服務應用是基於 Node 原生的 HTTP 模塊，對其進行封裝形成的，我們先用原生 Node 實現 HTTP 服務 const http = require('http') const server

koa2 , node.js , 前端 , Javascript

收藏 評論

jiaolvdekaixinguo 頭像

FFF方 - 在node環境下使用Mongoose來操作MongoDB

一. 準備工作 在create-react-app 腳手架工具的src文件夾創建pages/Server/server.js做好前期準備工作。 二. 前置文件安裝 yarn add mongoose ,yarn add express,yarn add nondemon 三. 理清概念 我們要知道要使用mongoDB數據庫，你必須先啓動mongoddb的服務，默認地址是localhost:27

mongodb , mongoose , 前端

收藏 評論

johanazhu 頭像

山頭人漢波 - 移動端法門：自適應方案和高清方案

筆者從畢業開始做前端到現在，90% 的項目是移動端打交道，所以當簡歷上寫了“移動H5”幾個字時，必會被問到自適應方案與高清方案 ”自適應“講的是一套UI（例如750*1334），在多端下展示近乎一樣的效果；而”高清“是因為 DPR 提升而所做的各種精度適配 這篇文章講講筆者理解的自適應方案和高清方案 先説結論 自適應方案 rem 適配思路 選擇一

佈局 , sass , 前端 , Javascript

收藏 評論

zhuyunbo 頭像

很白的小白 - 瀏覽器存儲及JavaScript重寫LocalStorage方法實現瀏覽器本地存儲設置時間問題

最近遇到了用户登錄信息本地存儲的問題，所以需要對瀏覽器的localStorage的存儲時間進行設置，因此重寫localStorage方法並在此記錄。 瀏覽器幾個存儲總結： localStorage保存的數據（大小5M左右），以“鍵值對”的形式長期存在。也就是説，每一項數據都有一個鍵名和對應的值，所有的數據都是以文本格式保存。保存的數據沒有過期時間，直到手動去除。 sessionStorage

瀏覽器 , localstorage , 前端 , Javascript

收藏 評論

invalidnull 頭像

註銷 - rxjs 裏 Skip 操作符的一個使用場景

skip 操作符允許我們忽略源的前 x 個排放。 當我們有一個始終在 subscription 上發出希望忽略的某些值的可觀察對象時，就可以使用這個操作符。比如 Observable emit 的前幾個值並不是我們感興趣的值，另一種情況是我們訂閲了 Replay 或 BehaviorSubject，並且不需要對初始值進行操作，而只關心初始值之後的數據 emit. 這種情況下，skip 操作符非常有

rxjs , angular , saprfc , sap , 前端

收藏 評論

lewyon 頭像

程序猿布歐 - javaScript深拷貝和淺拷貝簡單梳理

在瞭解深拷貝和淺拷貝之前，我們先梳理一下： JavaScript中，分為基本數據類型（原始值）和複雜類型（對象），同時它們各自的數據類型細分下又有好幾種數據類型 基本數據類型 數字Number 字符串String 布爾Boolean Null Undefined Symbols BigInt 基本數據類型在內存當中，是存儲在棧Stack 在數據結構當中 棧在內存上的分配的空間生命週期很短，當變

ecmascript-6 , ecmascript , 前端 , Javascript

收藏 評論

lewyon 頭像

程序猿布歐 - javaScript中Number數字類型方法入門

前言 Number和Math都屬於JavaScript中的內置對象，Number數字類型作為基礎數據類型，我們在開發過程中會經常用到，包括數字精度的格式化，還有字符串轉換成數字等操作。 Number數字 自帶屬性值 Number.EPSILON 兩個可表示(representable)數之間的最小間隔。 Number.MAX_SAFE_INTEGER JavaScript 中最大的安全整數 (

ecmascript , 前端 , Javascript

收藏 評論

liuliuliuliuliudaling 頭像

怪大大鈴 - Angualr 上手難？先從 8 個開源項目開始！

多年的學習經驗告訴我，瞭解一個概念最快的方式是看他的實踐，所以我整理出了 8 個在學習 Angular 過程中可以參考的開源項目，學習如何怎麼使用 Angular 框架～ 1. NGX-Admin github.com/akveo/ngx-a… 官網：akveo.github.io/ngx-admin/ 一個好看的極簡風格管理後台模板項目，有豐富主題的，部署方便，強推想要學習 Angula

angularjs , github , 開源 , 前端

收藏 評論

aran_tu 頭像

掘金安東尼 - 5 張彈珠圖徹底弄清 RxJS 的拉平策略：mergeMap、switchMap、concatMap、exhaustMap

RxJS 的操作符理解起來確實比較複雜，比如最常用的幾種 map 操作符，本篇就來使勁衝一衝它們！！ 原創文章，非商業轉載請説名出處 map 操作想必大家一定不陌生： const { of } = Rx; const { map } = RxOperators; const namesObservable = of('A', 'B'); namesObservable.pipe(

rxjs , 前端 , Javascript

收藏 評論