- 博客(21)
- 收藏
- 关注
RSS订阅原创 关键路径渲染优化
优化关键路径渲染（CRP）是提升网页加载性能的核心策略，主要包括减少关键资源数量、缩短关键路径长度以及优化CSS与JavaScript交付。具体措施包括内联关键CSS、延迟加载非关键资源、使用服务端渲染或静态生成、预加载关键资源、拆分CSS和JavaScript文件、利用缓存机制等。此外，优化渲染树构建、合理使用异步加载策略以及持续监控性能指标（如FCP、LCP）也是重要手段。通过以上方法，可以有效提升首次绘制时间和可交互性，优化用户体验。
2025-06-30 16:00:55
648
原创 CORS剖析
CORS（跨域资源共享）是HTTP1.1规范中的跨域解决方案。它根据请求对服务器的影响程度，定义了三种交互模式：简单请求、需要预检的请求和附带身份凭证的请求。简单请求满足特定方法（GET/POST/HEAD）和安全请求头条件，浏览器会自动添加Origin头，服务器通过Access-Control-Allow-Origin响应允许跨域。需预检的请求会先发送OPTIONS预检请求，确认权限后再发送实际请求。附带凭证的请求需设置withCredentials，服务器需明确响应Access-Control-Allo
2025-06-20 10:18:59
965
原创 XSS攻击：原理、类型与防御策略详解
XSS（跨站脚本）攻击通过在网页中注入恶意脚本窃取用户数据或控制行为，主要分为存储型、反射型和DOM型三类。攻击原理是利用网站对用户输入过滤不足，将恶意代码植入页面。其危害包括数据泄露、会话劫持和页面篡改。防御措施包括：输入过滤/转义、输出编码、CSP策略、HttpOnly Cookie及前端防护工具。典型案例包括论坛签名XSS和恶意链接攻击。开发者应遵循"输入不信任"原则，结合多层防护和定期安全测试，从源头遏制XSS漏洞。
2025-06-20 10:11:37
429
原创 ESM静态导入和动态导入
摘要：本文对比了ESM模块的静态导入和动态导入。静态导入在编译时解析，必须置于顶层，支持Tree Shaking优化；动态导入则在运行时加载，允许条件触发和路径变量，适合懒加载等场景。静态导入适用于固定依赖，动态导入更灵活但需权衡性能。现代浏览器均已支持这两种方式，不兼容环境可通过Babel转译实现。开发者应根据具体需求选择合适的方式，优先考虑静态导入以获得更好的优化效果。
2025-06-18 10:36:47
386
原创 vue2响应式原理
面试题：请阐述vue2响应式原理vue官方阐述：https://cn.vuejs.org/v2/guide/reactivity.html，是当对象本身或对象属性发生变化时，将会运行一些函数，最常见的就是render函数。在具体实现上，vue用到了。
2025-06-11 21:27:41
693
原创 AST（抽象语法树）解析
解答：AST 是源代码语法结构的抽象表示，以树状形式呈现。代码编译：编译器可以根据 AST 生成目标代码，例如 Babel 就是通过操作 AST 将现代 JavaScript 代码转换为旧版本的代码。代码转换：可以对 AST 进行修改和转换，实现代码的优化、压缩、混淆等功能。代码分析：通过分析 AST 可以进行代码的静态检查、语法检查、代码复杂度分析等。
2025-04-23 13:26:24
1096
原创 js函数柯里化、高阶函数、低阶函数的概念、代码示例以及3者的关系
函数柯里化是一种将多参数函数转换为一系列单参数函数的技术。通过柯里化，你可以将一个接收多个参数的函数转换为每次只接收一个参数的函数，并且返回一个新的函数，该新函数会等待接收剩余的参数，直到所有参数都被提供后才执行原函数的逻辑。高阶函数在 JavaScript 中非常常见，它为代码的复用和抽象提供了强大的能力。相对高阶函数而言，低阶函数就是普通的函数，它既不接收函数作为参数，也不返回函数。
2025-04-23 13:17:43
373
原创 js垃圾回收机制
解释：内存泄漏是指程序在运行过程中，由于某些原因导致内存无法被释放，从而导致内存占用不断增加。避免使用全局变量。及时清除定时器。避免不必要的闭包。代码示例// 定时器导致的内存泄漏}, 1000);// 避免内存泄漏，清除定时器}, 5000);// 全局变量导致的内存泄漏// 避免全局变量内存泄漏，将其置为 null// DOM 元素引用导致的内存泄漏// 移除子元素引用以避免内存泄漏。
2025-04-23 11:14:17
479
原创 for循环与forEach的区别
在前端开发里，for循环和forEach都常用于遍历数据，不过在语法、使用灵活性、性能、中断操作等方面存在明显差异，下面为你详细介绍：
2025-03-31 16:05:24
587
原创 14-树形结构
树的度：这棵树有最多叉的节点，有多少个叉，这课树的度就为多少（上图为5）树的深度：树最深有几层，树的深度就为几（上图为4）节点：既不是根节点，又不是叶子节点的普通节点。树形结构又叫有向无环图，树是图的一种。树形结构有一个根节点，没有回路。叶子节点：下边没有其他节点了。
2025-03-25 10:44:50
140
原创 作用域及作用域链
作用域是指变量和函数的可访问范围，它决定了代码中变量和函数的生命周期以及可见性。作用域控制着变量和函数的作用范围，确保变量和函数只能在其定义的特定区域内被访问和使用。作用域链是由多个嵌套的作用域组成的链表结构，它用于查找变量和函数的定义。当在某个作用域中访问一个变量或函数时，JavaScript 引擎首先会在当前作用域中查找，如果找不到，就会沿着作用域链向上查找，直到找到该变量或函数的定义，或者到达全局作用域。
2025-03-03 11:01:09
411
原创 简单明了的弄懂js闭包
当闭包不再需要时，我们可以手动释放对外部变量的引用，以便垃圾回收机制可以回收这些内存。当闭包一直持有对外部变量的引用，而这些变量不再被使用时，就可能导致内存泄漏。闭包是函数与其词法环境的组合，内部函数持有外部变量引用导致无法回收。形成了一个闭包，因为它可以访问。函数形成了一个闭包，它引用了。的引用，垃圾回收机制可以回收。也无法被垃圾回收，因为。函数仍然持有对它的引用。，这样闭包就不再持有对。在这个例子中，我们将。
2025-03-03 10:46:28
191
原创 详解数组方法reduce
reduce是一个强大的工具，适用于需要对数组进行累积操作的场景。通过灵活使用回调函数和初始值，可以实现各种复杂的聚合操作。
2025-02-26 17:10:07
348
原创 详解CSRF攻击及解决方案
CSRF 即跨站请求伪造（Cross - Site Request Forgery），是一种常见的 Web 安全漏洞。攻击者通过诱导用户在已登录的受信任网站上执行非本意的操作，利用的是用户在浏览器中已经建立的身份验证会话。
2025-02-20 16:18:49
1233
原创 DNS域名解析
DNS（Domain Name System）域名解析，简单来说，就是将人类易于记忆的域名转换为计算机能够识别和处理的IP地址的过程。比如我们在浏览器中输入www.example.com，DNS系统会把这个域名转换为对应的IP地址，如192.0.2.1，这样计算机才能找到目标服务器并获取相应的网络资源。
2025-02-20 15:43:32
290
原创 this指向详解
在 JavaScript 中，this关键字的指向在不同的场景下会有所不同，这也是很多前端开发者感到困惑的地方。下面我会通过不同的场景来详细讲解this的指向，并附上相应的代码示例。
2025-02-20 15:30:54
291
原创 call()、apply()和bind()方法有什么区别
call()apply()和bind()是 JavaScript 中 Function 对象的三个方法，它们都与函数的上下文（即this。
2025-02-20 15:22:26
391
原创 js表达式和js语句的区别
在vue的template模板中，我们经常会用到{{xxx}}那么{{xxx}}中的xxx到底可以写什么呢？根据vue官方定义来说，xxx是指任何js表达式。那么js表达式又是什么呢，和js语句有什么区别呢。
2022-09-13 23:13:54
216
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人