tag 前端

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

@前端 / 博客 RSS 訂閱

jdcdevloper 頭像

京東雲開發者 - MCube動態化與原生工程結合最佳實踐 | 京東雲技術團隊

跨端動態化開發方案重要性日益凸顯，本文對我們團隊MCube動態化實踐做了總結，為大家提供經驗和借鑑。 接入背景 隨着我們工程的需求迭代，暴露出了業務需求量大，分端開發和發版更新成本高等痛點，使用H5頁面來代替，在用户體驗和性能相較原生有差異，所以我們團隊開始了對動態化改造的研究。 在做過一些列動態化開發的嘗試，並對多種方案進行調研後，我們選擇了MCube的動態化方案。之所以選用MCube，是因為它

動態化 , 跨平台開發 , 跨域 , 前端

收藏 評論

jdcdevloper 頭像

京東雲開發者 - PWA 離線方案研究報告 | 京東雲技術團隊

本文並不是介紹如何將一個網頁配置成離線應用並支持安裝下載的。研究PWA的目的僅僅是為了保證用户的資源可以直接從本地加載，來忽略全國或者全球網絡質量對頁面加載速度造成影響。當然，如果頁面上所需的資源，除了資源文件外並不需要任何的網絡請求，那它除了不支持安裝到桌面，已經算是一個離線應用了。 什麼是PWA PWA（Progressive Web App）是一種結合了網頁和原生應用程序功能的新型應用程序開

pwa , webkit , 離線應用 , HTML , 前端

收藏 評論

grewer 頭像

Grewer - V8 入門記錄一：初識

關於 V8 我想前端從業人員或多或少會聽説過這個詞，但是他具體是什麼， 怎麼入門， 怎麼學習是一個較高的門檻，本文就 V8 入門，來做一個記錄，也方便大家的學習。 V8 是 Google 用 C++ 編寫的開源高性能 JavaScript 和 WebAssembly 引擎。它被用於 Chrome 瀏覽器和 Node.js 等。它實現了 ECMAScript 和 WebAssembly，可在 Win

v8 , v8js , 瀏覽器 , 前端框架 , 前端

收藏 評論

guisijun 頭像

歸思君 - JavaScript中的this指向哪？

大家好，我是歸思君 一、引言 this可以説是前端開發中比較常見的一個關鍵字，由於其指向是在運行時才確定，所以大家在開發中判斷其方向時也會很模糊，今天就把this的指向問題拆開了，揉碎了，好好講一講。 先來看一個場景，看看該處的 this 應該指向哪：首先在 request.js 中定義一個 getAction 函數 export function getAction(url,paramet

this , 前端 , Javascript

收藏 評論

invalidnull 頭像

註銷 - node.js 項目中執行 npm install 命令後看到的 idealTree inflate 的含義

隱身窗口是Chrome瀏覽器的一項隱私功能，它允許用户在瀏覽網頁時保護個人隱私。當用户在隱身窗口中瀏覽時，瀏覽器不會保存瀏覽歷史、搜索歷史、下載記錄以及填寫的表單數據。這一功能有助於用户在不留下痕跡的情況下訪問網頁，尤其是在共享計算機或公共場所使用時更為重要。 隱身窗口的核心特性 不保留瀏覽歷史記錄： 隱身窗口模式下，Chrome瀏覽器不會保存用户的瀏覽歷史記錄。這意味着在關閉隱身窗口後，之前

spring , ruby-on-rails , node.js , 前端 , Javascript

收藏 評論

wswx 頭像

goblin_pitcher - 二分查找的通用模板

二分查找的概念本身很容易理解，這裏不做贅述。其使用前提只有一個：單調數組 樸素二分查找 當在一個有向數組中，查找數組中是否有某個值，代碼很簡單： const binarySearch = (nums, target) = { let l = 0; let r = nums.length - 1; while(l=r) { const mid = (l+r) 1 if(

數據結構和算法 , 前端

收藏 評論

wswx 頭像

goblin_pitcher - 數據結構算法小結

前言 解決問題思維方式 假設我們有一整套螺絲刀，要進行筆記本清灰操作，我們主要的思維邏輯如下： 若要清灰，必須先取出風扇 若要取出風扇，必須先把從外殼到風扇的螺絲全部拆下 那麼清灰問題就變成了拆一堆不同規格的螺絲，當我們看到不同規格的螺絲，就會比較螺絲口大小、形狀和螺絲刀規格，從而選取對應的螺絲刀。 可以看出，當我們遇到一個複雜問題，下意識的思維方式就是將一個複雜問題，轉移成我們熟知的一些

數據結構和算法 , 前端

收藏 評論

jdcdevloper 頭像

京東雲開發者 - 如何利用燭龍和谷歌插件優化CLS(累積佈局偏移) | 京東雲技術團隊

簡介 CLS 衡量的是頁面的整個生命週期內發生的每次意外佈局偏移的最大突發性_佈局偏移分數_。佈局變化的發生是因為瀏覽器傾向於異步加載頁面元素。更重要的是，您的頁面上可能存在一些初始尺寸未知的媒體元素。這種組合意味着瀏覽器在加載完成之前無法確定單個元素將佔用多少空間。因此，這種不確定性帶來的劇烈佈局轉變就會導致一個高的CLS分數，也就説明用户體驗將會很糟糕。 累積佈局偏移的計算公式 = 影響比例*

佈局 , 前端 , Javascript

收藏 評論

jdcdevloper 頭像

京東雲開發者 - 解析$nextTick魔力，為啥大家都愛它？

1.為什麼需要使用$nextTick? 首先我們來看看官方對於$nextTick的定義: 在下次 DOM 更新循環結束之後執行延遲迴調。在修改數據之後立即使用這個方法，獲取更新後的 DOM。 由於vue的試圖渲染是異步的，生命週期的created()鈎子函數進行的DOM操作一定要放在Vue.nextTick()的回調函數中，原因是在created()鈎子函數執行的時候DOM其實並未進行渲染，而此時

vue.js , dom , 前端 , Javascript

收藏 評論

nanchengfe 頭像

南城FE - [譯]優秀的URL設計

本文翻譯自 Examples of Great URL Design，作者：Jim Nielsen， 略有刪改。 以下是Kyle Aster關於URL的設計為何重要的觀點（2010年）： URL是通用的。它們可以在Firefox、Chrome、Safari、Internet Explorer、cURL、wget、iPhone、Android中使用，甚至可以寫在便籤上。它們是網絡的一種通用語法，但別

前端 , Javascript , url

收藏 評論

vivo_tech 頭像

vivo互聯網技術 - 前端 JS 安全對抗原理與實踐

作者：vivo 互聯網安全團隊- Luo Bingsong 前端代碼都是公開的，為了提高代碼的破解成本、保證JS代碼裏的一些重要邏輯不被居心叵測的人利用，需要使用一些加密和混淆的防護手段。 一、概念解析 1.1 什麼是接口加密 如今這個時代，數據已經變得越來越重要，網頁和APP是主流的數據載體，如果獲取數據的接口沒有設置任何的保護措施的話，數據就會被輕易地竊取或篡改。 除了數據泄露外，一些重要功能

混淆 , 調試 , 前端 , Javascript

收藏 評論

chenxiaoxi_619df8932f34a 頭像

陳小西 - 對於企業軟件系統而言，唯一重要的架構設計是什麼

相對於系統軟件而言，企業軟件往往是面向應用場景、業務邏輯。雖然很多工程師、架構師會面帶嚴峻表情的告訴你，軟件項目所要保障的高可用性、魯棒性、可擴展性、高併發性、低延遲性、安全性、可測試性、靈活性，是如何如何的重要，彷彿一套只有幾個部門三五十人用的軟件系統，其架構也得是多麼科學、嚴謹、隆重的經歷一系列的設計、論證、測試，姿勢拉好、儀式感滿滿。 但現實中，多少企業的軟件系統是由代碼屎山堆成，多少IT運

pwa , 小程序 , 前端 , html5

收藏 評論

nanchengfe 頭像

南城FE - 2023 年最受歡迎的 12 款 Chrome 瀏覽器擴展

谷歌瀏覽器Chrome是目前最受歡迎的瀏覽器之一，而瀏覽器擴展則是為了提升用户體驗和功能而開發的插件。 2023年穀歌公佈了12款最受歡迎的Chrome瀏覽器擴展。每個都提供獨特的功能來增強您的瀏覽體驗。以下是它們的詳細介紹： Speechify：將Google文檔、PDF、網頁或書籍轉換成語音，擁有30多種語言的自然發音聲音。 QuillBot：一套AI驅動的寫作工具，包括語法檢查

chrome , chrome-extension , Linux , 前端 , Javascript

收藏 評論

guisijun 頭像

歸思君 - 聊一聊 JavaScript 中的作用域和閉包

哈嘍大家好，我是歸思君~ 一、引言 我們知道，作用域（Scope）就是代碼中變量和函數的可訪問的區域，這個區域中決定了變量和函數的生命週期。在當前的高級程序語言中，主要有詞法作用域（靜態作用域）和動態作用域兩種。 靜態作用域：其作用域是在編寫代碼時就已經確定好，靜態作用域是根據變量和函數在代碼中的位置來決定。函數尋找變量時，是在函數定義的位置中尋找，而不是調用的位置。現在大多數編程語言都採用的

作用域 , 閉包 , 作用域鏈 , 前端 , Javascript

收藏 評論

wswx 頭像

goblin_pitcher - 單調棧模板和適用範圍

刷力扣時，遇到關鍵詞：下一個更大/小的數這類題目時，往往會採用單調棧的解法，如每日温度 刷題最常見的問題就是，看到題解，感覺很精妙，但下次遇到一模一樣的題目時，往往知道思路，但寫不出代碼，有或者遇到類似的變體題目時，不會往這方面想。這兩種情況在之前的文章(數據結構算法小結)中提到過，分別有兩方面的原因： 對工具（如單調棧知識點）的特性（適用範圍）不明朗 對工具的原理沒有真正的理解 初學單調

數據結構和算法 , 前端 , Javascript

收藏 評論

nanchengfe 頭像

南城FE - 炫酷鼠標懸停隨機漸變文本動畫效果

如圖所示，這是一個很炫酷的鼠標懸停動畫效果，卡片的文字隨着鼠標的移動不斷變化着，且文字的顏色伴隨着漸變色跟隨鼠標移動，中心部分是突出的LOGO效果，整個交互效果十分引人注目。原效果來源於 evervault.com/customers 這個網站，有興趣的可以體驗看看～ 本次文章將解析如何用代碼實現這個效果，根據上面的動圖分析出我們要實現的幾個主要功能點： 卡片在鼠標懸停時出現漸變隨機文字

css3 , 動畫 , Css , 前端

收藏 評論

apifox 頭像

Apifox - 精通軟件質量提升的利器：Mock 測試教程

在軟件工程的套路中，虛擬化測試，又稱 Mock 測試，扮演一個無可或缺的角色。Mock 測試允許工程師仿製和操控對象、服務或者系統組件等的行為，使得人們能在一個乾淨獨立的環境裏測試特定功能。這種方法能確保測試聚焦於代碼邏輯，而非外圍干擾因素。 Mock 測試的核心概念 Mock 測試 用虛擬對象取代實際對象，通過控制外部依賴，帶來了測試的隔離性和準確性，從而確立了代碼的穩定性及其長期維護性。 Mo

mock.js , mock , mockito , 前端工程師 , 前端

收藏 評論

anran758 頭像

anran758 - Promise 與異步編程

Promise 是 JavaScript 中的一個重要概念，與前端的工作更是息息相關。因此本文將整理一下 Promise 在日常工作中的應用。 概念 從 MDN | 使用 Promise 中我們能學習到 Promise 的基礎使用與錯誤處理、組合等概念，可以將 Promise 的特點概括為: Promise 對象有三種狀態，且狀態一旦改變就不會再變。其值記錄在內部屬性 [[Promis

promise , node.js , 異步編程 , 前端 , Javascript

收藏 評論

sigui_5f58bd7ced379 頭像

周翔宇 - JavaScript——數組的reduce方法

JavaScript的reduce和reduceRight的作用是通過順序或逆序遍歷數組，從而得到一個結果，原理如下： function myReduce(execute, initValue) { const length = this.length let result for (let i = 0; i length; i++) { if (i =

數組 , reduce , 數組去重 , 前端 , Javascript

收藏 評論

yixiyidong 頭像

卡牌大師 - 前端本地開發，URL如何設置？

一、問題背景 前後端分離的 web 項目，前端本地開發的 URL 大多是“http+localhost+端口”，如 http://localhost:3000。用此 URL 開發，會遇到三類問題。一是跨域，二是 cookie 種植，三是調用外部服務需要真實域名。 跨域問題。如果你遇到跨域問題，大概率就會看過如下圖片，此時瀏覽器不讓你把請求發送到出去。 為什麼會這樣？背後的原因是瀏覽器的同源策略（

代理 , 前端 , url

收藏 評論

invalidnull 頭像

註銷 - 關於 PWA url 參數 ngsw-bypass=true

"ngsw-bypass-true" 這個參數是與 Angular Service Worker (ngsw) 相關的一個選項，用於控制在 Service Worker 中是否繞過緩存，直接請求網絡資源。在 Angular 應用中，Service Worker 主要負責緩存應用的靜態資源，以提高應用的性能和用户體驗。 首先，讓我們瞭解一下 Angular Service Worker 的基本概念。

ecmascript-6 , pwa , typescript , 前端 , Javascript

收藏 評論

chongdianqishi 頭像

機器馬 - ReactRouter6 的一些坑點

問題 這幾年忙着寫 Taro 相關業務，所以很久沒有再接觸 ReactRouter 了。從當年使用的 ReactRouter v3 VueRouter v2，功能和寫法都沒什麼差別，而到現在的 ReactRouter v6，就感覺變化十分大。這裏從使用者的角度聊聊，初次上手 v6 的感受和如何應對這些變化。 變化 範式 函數化和標準化，讓其源碼減少了一半 v6 全面擁抱 Hooks，API

react , react-router , 前端

收藏 評論

liuyuedekele 頭像

六月的可樂🥤 - 智能API代碼示例生成工具AiRestful

一、產品介紹 AiRestful是一款基於智能AI的,幫助小白快速生成任意編程語言的API接口調用示例代碼的編程工具.它的特點是:簡單易用、集成支持、多主流編程語言覆蓋.它是面向學生、編程愛好者、編程小白的實用工具. AiRestful官網: 點擊直達AiRestful官網 二、如何使用 AiRestful是簡單易用的,只需要三步即可為您生成您需要的編程語言的代碼示例. 1、第一步(必須): 根

restful , 人工智能 , 深度學習 , 前端 , Javascript

收藏 評論

lengcang 頭像

茶色島 - JavaScript面向對象

一：面向對象 1.面向對象基本特徵 封裝：也就是把客觀事物封裝成抽象的類，並且類可以把自己的數據和方法只讓可信的類或者對象操作，對不可信的進行信息隱藏 繼承：通過繼承創建的新類稱為“子類”或“派生類”。繼承的過程，就是從一般到特殊的過程 多態：對象的多功能，多方法，一個方法多種表現形式 2.javascript和麪向對象 javascript是一種基於對象（objec

oop , 前端 , Javascript

收藏 評論