博客 / 列表

銀之夏雪 - js繼承您瞭解多少呢

實現繼承的方式有很多,下面我們來寫常用的幾種(包括但不限於原型鏈繼承、構造函數繼承、組合繼承、寄生組合繼承、ES6繼承): 原型鏈繼承 原型鏈繼承通過修改子類的原型為父類的實例,從而實現子類可以訪問到父類構造函數以及原型上的屬性或者方法。 // 原型鏈繼承 function Parent () { this.name = 'kobe' } Parent.prototype.getName

原型 , 繼承 , 原型鏈 , 前端 , Javascript

銀之夏雪 - AntV G6 基礎元素詳解(React版)

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

數據可視化 , 前端 , Javascript

銀之夏雪 - this你瞭解多少呢

執行上下文 js在執行代碼之前,需要經過一系列的“準備”,這被稱為執行上下文 ,其包含詞法環境 和this 。所有的 js 代碼在運行時都是在執行上下文中進行的,每創建一個執行上下文,就會將當前執行上下文放到一個棧頂,這就就是我們常説的執行棧 。 執行上下文的創建 何時創建執行上下文 JavaScript 中有三種情形會創建新的執行上下文: 全局執行上下文 ,進入去全局代碼的時候。任何不在函數

面試 , this , 前端 , Javascript

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

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

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

銀之夏雪 - 從底層到實踐:深度解析 Vue Composition API 與 React Hooks 的異同

一、設計哲學與底層原理差異 1.1 響應式系統的基因差異 Vue3 的 Composition API 建立在 Proxy-based 響應式系統之上,通過劫持對象的 getter/setter 實現依賴收集。當訪問響應式對象時,Vue 會自動建立組件與數據的依賴關係。 // Vue 響應式原理簡版實現 function reactive(obj) { return new Proxy(obj

react , vue.js , react-hooks , vue3 , 前端

銀之夏雪 - Vue 3 vs Vue 2:深入解析從性能優化到源碼層面的進化

Vue.js 是當今前端開發中最受歡迎的框架之一。隨着 Vue 3 的發佈,它在性能優化、開發體驗、響應式系統、構建工具和熱更新等多個方面都帶來了巨大提升。本文將深入剖析 Vue 3 的進化,包括其 源碼實現 方面的優化,如 diff算法、靜態標記、編譯優化 ,以及 Vue 3 在熱更新、構建工具上的改進。 1. 性能提升:底層優化的革命 1.1 響應式系統的改進:從 Object.defineP

vue2 , vue.js , vue3 , 前端 , Javascript

銀之夏雪 - 深入剖析為什麼順序調用對 React Hooks 很重要?

在享受 React Hooks 帶來的便捷性的同時,我們必須嚴格遵循順序調用的規則,這一規則的重要性遠超我們的想象。本文將深入探討順序調用對 React Hooks 的重要性,並結合常見的缺陷,通過具體的代碼案例進行詳細闡述,揭示其背後深層次的原理。 一、React Hooks 工作原理 理解 React Hooks 的工作原理是掌握順序調用重要性的關鍵。React 內部維護着一個 Hooks 鏈

react , react-hooks , 前端 , Javascript