构建时js加上哈希值解决缓存问题
在前端工程化中，文件名哈希（Hash）的核心目的是解决浏览器缓存问题（Cache Busting）。通过给文件名加上基于内容计算的唯一标识，可以确保当代码更新时，文件名会随之改变，从而强迫浏览器下载最新资源，而未改变的文件则继续沿用缓存。 …
828 字3 分钟
前端开发 / 工程化Obsidian
载入中...
载入中...
共 205 篇文章
在前端工程化中，文件名哈希（Hash）的核心目的是解决浏览器缓存问题（Cache Busting）。通过给文件名加上基于内容计算的唯一标识，可以确保当代码更新时，文件名会随之改变，从而强迫浏览器下载最新资源，而未改变的文件则继续沿用缓存。 …
在前端开发中，处理引用数据类型（对象、数组）时，深拷贝是一个绕不开的核心概念。它的本质是在内存的堆区重新开辟一块空间，完整地复制目标对象及其所有嵌套的子对象，从而彻底切断与原对象的引用联系。 为了在不同业务场景中做出最合理的选择，我们可以将…
虚拟列表（Virtual Scrolling）的核心运作逻辑，是基于人眼视觉的局限性：我们只需要渲染当前视口（Viewport）内能看到的元素，加上视口上下少量的缓冲元素。其余成千上万的数据，只需在内存中保留状态，不需要生成实际的 DOM …
从本质上看，轮播图的核心机制是一个带有固定视口（Viewport）的遮罩层加上一个可以横向或纵向移动的内容轨道（Track）。视口负责隐藏溢出的内容，而通过改变轨道的位移（通常是 CSS 的 transform 属性），就能实现内容的切换。…
请完整描述从输入网址到浏览器渲染出页面，发生了什么？ 第一步：URL 解析与缓存判断 1. 解析 URL：浏览器会首先分析输入的字符串。提取出协议（如 https）、域名（如 www.example.com）、端口（默认 HTTPS 为 …
101. 对称二叉树 Symmetric Tree 示例说明 示例 1： 输入： root = 1,2,2,3,4,4,3 输出： true 结构展示： Plaintext …
React 的核心不仅在于它的组件化思想，更在于其底层维持高性能和响应性的精妙算法设计。在面试和实际架构理解中，核心算法主要围绕 找出差异（Diffing）、任务调度（Fiber）、优先级管理（Lanes） 以及 状态闭包与存取（Hooks…
在 JavaScript 的世界里，Set 是一种非常纯粹的数据结构。如果说 Array（数组）是一个有顺序、允许重复的“购物清单”，那么 Set（集合）更像是一个具有排他性的“俱乐部”：它只在乎你“在不在”，而不在乎你在哪个位置，且绝不允…
前端面试中的编程题通常不是为了刁难你的数学天赋，而是为了考察你对底层机制的理解（如事件循环、内存引用、异步）以及对日常业务中复杂数据处理的抽象能力。 为了最大化覆盖面试场景，我们将高频题目分为三大类：JavaScript 核心机制伪造（手写…
题目描述 给定一个未排序的整数数组 nums ，找出数字连续的最长序列（不要求序列元素在原数组中连续）的长度。 进阶： 你可以设计并实现时间复杂度为 $On$ 的解决方案吗？ 提示 $0 \le \text{nums.length} \…
移动零 Move Zeroes 题目描述 给定一个数组 nums，编写一个函数将所有 0 移动到数组的末尾，同时保持非零元素的相对顺序。 请注意，必须在不复制数组的情况下原地对数组进行操作。 示例 1: 输入: nums = 0,1,0…
为了彻底理清 JavaScript 的集合体系，我们需要从最底层的内存管理机制出发。无论是 Map 还是 Set，它们最核心的区别不在于 API 的好用程度，而在于它们如何与系统的垃圾回收（Garbage Collection, GC）对话…