@前端

动态 列表
@fenanjiu

一文搞懂V8引擎的垃圾回收機制

前言 我們平時在寫代碼的過程中,好像很少需要自己手動進行垃圾回收,那麼V8是如何來減少內存佔用,從而避免內存溢出而導致程序崩潰的情況的。為了更高效地回收垃圾,V8引入了兩個垃圾回收器,它們分別針對不同場景進行工作。 如果這篇文章有幫助到你,❤️關注+點贊❤️鼓勵一下作者,文章公眾號首發,關注 前端南玖 第一時間獲取最新文章~ 垃圾從何而來 我們先來搞清楚這些‘垃圾’是怎麼產生的 不管使用哪一

fenanjiu 头像

@fenanjiu

昵称 南玖

@skychx

⚡️ The Cost Of JavaScript (2017 - 2023) | JavaScript 性能優化之旅

如果你喜歡我的文章,希望點贊👍 收藏 📁 評論 💬 三連支持一下,謝謝你,這對我真的很重要! 吐槽時間 不知道從什麼時候開始,前端開始卷一些 “高端知識”,動不動就瀏覽器底層原理,V8 是如何運行的,倒不是説這些沒啥用,只是來勢洶洶好像不懂這些就不能糊頁面一樣。 我工作中和內核團隊與虛擬機團隊也合作過並諮詢過他們這些相關問題,大家的態度也很明確,面對這種千萬行代碼的大型工程項目,他們作為專業

skychx 头像

@skychx

昵称 鹵代烴

@grewer

V8 入門記錄一:初識

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

grewer 头像

@grewer

昵称 Grewer

@limingcan562

不幸中帶點萬幸的2022,該何去何從的2023

本文參與了 SegmentFault 思否年度徵文「一名技術人的 2022」,歡迎正在閲讀的你也加入。 前言 手指在鍵盤上滴答滴答敲着,臉龐感受着窗外清風輕輕的拍打,身體正接受着陽光的沐浴。在手指按下鍵盤的瞬間,我扭了扭脖子,伸了伸懶腰,看向電腦右上角的日期,距離2022年結束,還有23天。 不幸中又帶點幸運的2022 在疫情的衝擊下,大環境都很低迷,對於大部分人來説,這是不幸的。在這片低迷的氛圍

limingcan562 头像

@limingcan562

昵称 limingcan

@imouou_5a60be738882f

【快速開發App實戰】BUI高仿網易新聞App系列一、搭建App開發環境和工作空間

一. 搭建App開發環境和工作空間 前言 我們的目標是要做一個真實的案例, 着重通過BUI框架及其相關工具的使用, 結合原生打包平台, 幫助大家理解一個App的開發過程. 以最新網易新聞的App為例, 儘量只描述過程, 細節可以自行完善, 高仿得太過以假亂真, 會有侵權問題 ^_^. 文章會分為多個小章節, 知識點逐個講解的方式, 每天掌握一點點, 進步一點點. 文章首發都會在bui神速訂閲號,

@imouou_5a60be738882f

[分享]高仿網易新聞WebApp模板源碼下載

BUI-163網易新聞 大小: 6.27M 該App基於BUI Webapp框架+Dcloud構建. 僅供學習交流使用. 整個app開發過程記錄在這裏bui神速訂閲號. 快速開發App系列篇 預覽 交互1: 下拉刷新, 加載分頁 交互2: Tab嵌套交互 交互3: 欄目刪減自動更新 交互4: 底部tab的交互, 每個Tab裏面還有各自的交互 下載 源碼下載: https

@pingan8787

5個Chrome調試混合應用的技巧

對前端開發人員來説,Chrome 真是一個必備的開發工具,大到頁面展示,小到 BUG 調試/HTTP 抓包等,本文我將和大家分享自己做混合應用開發過程中經常用到的幾個調試技巧。 一、調試安卓應用 在進行混合應用開發過程中,經常需要在安卓應用中調試 H5 項目的代碼,這裏我們就需要了解安卓應用如何在 Chrome 上進行調試。 接下來簡單介紹一下,希望大家還是能實際進行調試看看: 1. 準備工

pingan8787 头像

@pingan8787

昵称 pingan8787

@moyuyaowan

【招商銀行-掌上生活-運行H5頁面】JS-SDK及其特有schema

掌上生活是一個比較先進的銀行App,不能單純當做瀏覽器來處理,其有專門提供的JS-SDK供調用 JS-SDK: https://open.cmbchina.com/Pla... 如果不想引入這個庫的話,有一些細微但重要的功能可以直接仿寫,比如判斷是否在掌上生活中,就是通過正則匹配UA判斷的 判斷是否在掌上生活中:/cmblife/.test(ua); 在該App內想要喚起美團,也不能直接使用

moyuyaowan 头像

@moyuyaowan

昵称 魔芋藥丸

@huobaodechahu

小程序會帶動Hybrid App崛起嗎?

Hybrid App 開發模式 Hhybrid App顧名思義就是原生 App 與 Web App 的結合。它的殼是原生 App,但是裏面放的是網頁。 可以理解成,混合 App 裏面隱藏了一個瀏覽器,用户看到的實際上是這個隱藏瀏覽器渲染出來的網頁。 混合 App 的原生外殼稱為"容器",內部隱藏的瀏覽器,通常使用系統提供的網頁渲染控件(即 WebView 控件),也可以自己內置一個瀏覽器內核。結構

huobaodechahu 头像

@huobaodechahu

昵称 火爆的茶壺

@chenxiaoxi_619df8932f34a

詳解主流的Hybrid App 技術框架與研發方案

移動操作系統在經歷了諸神混戰之後,BlackBerry OS、Symbian OS、Windows Phone等早期的移動操作系統逐漸因失去競爭力而退出。目前,市場上主要只剩下安卓和iOS兩大陣營,使得iOS和安卓工程師成為搶手資源。然而,由於兩者系統的差異,開發同一個應用需投入兩倍的工作量,不僅增加了人力成本,而且由於不同團隊的開發,細節實現和應用一致性也面臨問題。 因此,迫切需要一種能夠一次開

@buddhad666

ios原生鍵盤兼容問題

出現的兼容問題是: 我寫的是H5,當我在input標籤的oninput事件裏寫入了正則表達式replace(/\s+/g, '')限制輸入框不能輸入空格,android手機中英文一切正常輸入,但是到了ios手機上,用ios原生鍵盤輸入中文時,明明習慣性的一次輸入多箇中文,但是點擊對應的文字到輸入框後卻變成了英文,還總是失去焦點。 沒找到問題的原因時臨時的解決方法就是一個字一個字的輸入或

buddhad666 头像

@buddhad666

昵称 buddha

@charlotteeeeeee

正則

1:須包含大寫字母、小寫字母、數字、特殊符號四種字符組合,長度不少於8位,特殊字符支持!@#$%^*? (/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[!@#$%^*?])[\da-zA-Z!@#$%^*?]{8,}$/) 2:僅支持漢字、數字、字母及特殊符號# /^(?!,)(?!.*?,$)[a-zA-Z0-9#\u4e00-\u9fa5]+$/ 3:名稱僅能包含

charlotteeeeeee 头像

@charlotteeeeeee

昵称 charlotteeeeeee

@baidujiagoushi

百度日誌中台前端重構實踐

日誌中台是百度內部針對打點數據的全生命週期管理平台,作為公司日誌數據的唯一入口,承擔以下核心職能:1.功能覆蓋:提供從數據採集、傳輸、存儲到查詢分析的一站式服務,支持產品運營分析、研發性能監控、運維管理等多元場景。2.業務賦能:通過標準化流程實現用户行為日誌的埋點申請、審批及退場管理,助力APP端、服務端等業務線挖掘數據價值。3.生態協同:與大數據平台、推薦中台、性能平台深度聯動,避免重複建設,提

baidujiagoushi 头像

@baidujiagoushi

昵称 百度Geek説

@yinzhixiaxue

AntV G6 基礎元素詳解(React版)

一、初識 AntV G6 AntV G6 是螞蟻集團推出的專業級圖可視化引擎,適合構建關係圖譜、拓撲圖、流程圖等場景。相比其他圖形庫,G6 提供完整的佈局算法 和交互體系 ,開發者在 10 分鐘內即可搭建可交互的圖應用。 技術特點速覽: 支持 Canvas / SVG 雙渲染模式 內置 10+ 圖佈局算法 提供豐富的節點/邊類型 完善的文檔和 React 示例 二、節點(Nodes)完

yinzhixiaxue 头像

@yinzhixiaxue

昵称 銀之夏雪

@xc_xiang

跨域方案總結

平時在開發中總是會遇到各種跨域問題,一直沒有很好地瞭解其中的原理,以及其各種實現方案。今天在這好好總結一下。 本文完整的源代碼請猛戳github博客,建議大家動手敲敲代碼。 1、什麼是跨域?為什麼會有跨域? 一般來説,當一個請求url的協議、域名、端口三者之間任意一個與當前頁面地址不同即為跨域。 之所以會跨域,是因為受到了同源策略的限制,同源策略要求源相同才能正常進行通信,即協議、域名、端口

xc_xiang 头像

@xc_xiang

昵称 Alan

@helloxiaoming

前端多種跨域方式實現原理詳解

跨域是我們在項目中經常遇到的,前後端數據交互經常碰到請求跨域,首先我們來想一下為什麼會有跨域這個詞的出現?本文帶你來探討一下以下幾個問題: 跨域是什麼? 為什麼要跨域? 跨域的幾種方式? ... 什麼是跨域? 跨域是指的瀏覽器不能執行其它網站的腳本,它是由瀏覽器的同源策略造成,是瀏覽器對JavaScript實施的安全限制。 跨域實際上指從一個域的網頁去請求另一個域的資源,比如:從 h

helloxiaoming 头像

@helloxiaoming

昵称 helloxiaoming

@angular4

postMessage 還能這樣玩

在日常工作中,消息通信是一個很常見的場景。比如大家熟悉 B/S 結構,在該結構下,瀏覽器與服務器之間是基於 HTTP 協議進行消息通信: 然而除了 HTTP 協議之外,在一些對數據實時性要求較高的場景下,我們會使用 WebSocket 協議來完成消息通信: 對於這兩種場景,相信大家都不會陌生。接下來,阿寶哥將介紹消息通信的另外一種場景,即父頁面與 iframe 加載的子頁面之間,如何進行消息通

angular4 头像

@angular4

昵称 阿寶哥

@fromin

全新的postmessage庫特性介紹與源碼解析

眾所周知,postMessage 是在不同頁面間進行通信的一種常用方式: window.postMessage() 方法可以安全地實現跨源通信。通常,對於兩個不同頁面的腳本,只有當執行它們的頁面位於具有相同的協議(通常為https),端口號(443為https的默認值),以及主機 (兩個頁面的模數 Document.domain設置為相同的值) 時,這兩個腳本才能相互通信。window.postM

fromin 头像

@fromin

昵称 Fromin

@kinglisky

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

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

kinglisky 头像

@kinglisky

昵称 臼犀

@steven_code

窗口間通信方案——postMessage

postMessage 是 html5 引入的 API,postMessage 方法允許來自不同源的腳本採用異步方式進行通信,其實同源不同頁面的腳本也可以採用 postMessage 方法進行通信。 介紹 發送數據 需要在接收數據窗口的全局對象下調用該方法。 targetWindow.postMessage(message, targetOrigin, [transfer]) targetWi

steven_code 头像

@steven_code

昵称 Steven