前端御书房

Pinia 3.0 标志着 Vue 生态的全面升级，建议开发者在新建项目中积极采用。对于存量项目，建议预留 2-3 周进行渐进式迁移，重点关注 TS 类型系统的兼容性验证。

48小时内实现前端全局防重复请求。

为什么Vue3源码中使用了？当看到React核心团队将核心调度器改用Map后性能提升。

当斐波那契数列计算量达10亿次时，页面完全冻结4.2秒！通过Web Worker优化后，UI响应时间。本文手把手带您实现性能蜕变！

从ES6到ES2025，JavaScript以每年一个里程碑的速度持续进化。已曝光7大杀手级特性，即将引爆前端开发新范式！

本文讲解签名板功能的实现

服务端渲染（Server-Side Rendering）指在的技术方案。

箭头函数无this，普通函数看调用new/显式定乾坤，默认绑定最危险。

官方宣称“比Vite更快，比Webpack更灵活”，但社区评价两极分化：有人称之为“前端工程化新标杆”，也有人吐槽“配置复杂，文档劝退”。作为深耕前端领域的开发者，笔者第一时间深度体验WXT，本文将结合代码实战，揭开它的真实面纱。“WXT在浏览器插件开发赛道的创新值得肯定，但其定位过于垂直。若团队专注插件开发，WXT+React的组合能提升50%以上效率。是一款专注于浏览器插件开发的现代化框架，支持Chrome、Firefox等多平台扩展构建。根据GitHub官方文档，，再上手WXT事半功倍。

作为开发人员，不断探索新内容，是我们必备的技能之一，今天就让我们一起来探索一下Set 对象的出色新增功能，我整理了7个内容，希望对你们有所帮助。

JavaScript 的 Observer 模式扮演着至关重要的角色。Observer模式允许开发者监听对象的变化，并在变化发生时自动执行相应的操作。这种机制在前端开发中尤为重要，尤其是在处理动态数据、用户交互和异步操作时接下来盘点一下 JavaScript 中那些至关重要的 Observer。

而JavaScript逆向的目的，就是通过对这些经过处理的代码进行反混淆、解密或解压缩，还原出原始的代码逻辑，从而理解其工作原理或寻找潜在的安全漏洞。然而，JavaScript逆向技术仍在不断发展和完善中，未来的研究方向包括更高效的反混淆和解密算法、更精确的动态执行和调试技术等。同时，我们也应该意识到，JavaScript逆向并非万能的。此时，我们需要借助内存分析工具（如浏览器的Memory tab），对JavaScript对象的内存占用、引用关系等进行深入分析，以提取出隐藏在内存中的关键数据。

在JavaScript的世界里，有着许多令人膛目结舌的代码技巧。这些技巧可以使你的代码更加简洁、高效，甚至在某些情况下，能够解决一些看似无解的问题。下面，我们就来聊聊那些让你目瞪口呆的JavaScript代码技巧。

webStorage提供了一种机制，可以让浏览器提供一种比cookie更直观的key、value存储方式。WebStorage的目的是解决通过客户端存储不需要频繁发送回服务器的数据时使用cookie的问题。WebStorage 提供了两个对象localStorage和sessionStorage，这两种浏览器存储API提供了在浏览器中不受页面刷新影响而存储数据的两种方式。

fetch发送get请求JavaScript 可以将网络请求发送到服务器，并在需要时加载新信息。对于来自 JavaScript 的网络请求，有一个总称术语 “AJAX”（Asynchronous JavaScript And XML 的简称）。有很多方式可以向服务器发送网络请求，并从服务器获取信息。fetch是其中之一，旧版本的浏览器不支持它（可以 polyfill），但是它在现代浏览器中的支持情况很好。我们来看一看它的基本语法let url="test.html";let te = fetch(u

什么是AJAXAJAX = Asynchronous JavaScript and XML（异步 JavaScript 和 XML）。通过在后台与服务器交换少量数据， 允许网页进行异步更新。可以使网页在不重新加载整个网页的情况下，对网页某些部分进行更新。AJAX发送请求的步骤创建一个请求对象var xhr = new XMLHttpRequest();console.log(xhr);由此ajax请求对象已经创建完成，我们可以看一下打印结果由此可见，该对象中有很多属性和方法，接下来我

什么是跨域跨域：两个网站之间协议头、域名、端口号任意一个不同就是跨域。同源：两个网站之间协议头、域名、端口号都一致就是同源。有时，我们使用ajax访问一个api，不能访问成功，并且报错，如下。此时，我们已经是跨域访问了，但是我们仍要访问，那么怎么解决呢。跨域解决方案——jsonp常见的跨域解决方案是jsonp，该方法比较简单，不涉及太多后端的知识。首先我们了解一下jsonp解决跨域的原理jsonp原理jsonp原理是使用不受跨域限制的标签发起请求，然后再将响应体转换为js能够识别的内容。

在介绍生成器函数之前先了解一下ES6的一个关键字，名为yieldyield关键字，可以让代码在其出现的地方暂停执行，它只能在生成器函数内部使用。

什么是回调地狱回调地狱就是在回调函数中再嵌套回调函数的一种现象。如图以上只是演示只写了三层，此次也只是为了讲解回调地狱的解决方案，才做此演示，在正常情况下，应该避免回调地狱的出现。由于在回调函数中嵌套函数就导致代码不易维护，可读性等问题。下面我们就来看一下其解决方案。解决方案Promise什么是PromisePromise是异步编程的一种解决方案，Promise是一个对象，可以获取异步操作的消息.。Promise的作用避免回调地狱的问题它可以解决回调地狱的问题，这也是我们介绍它的原因

变量的解构赋值数组的解构赋值ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。var [a, b, c] = [1, 2, 3];本质上，这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。如果解构不成功，变量的值就等于undefined。var [foo] = [];var [bar, foo] = [1];不完全解构，即等号左边的模式，只匹配一部分的等号右边的数组。这种情况下，解构依然可以成功。le

箭头函数是ES6中一种新的函数的表达式,其参数与函数体之间用箭头连接，因此成为箭头函数。它也是匿名函数的一种。其基本用法与匿名函数一致，只是略有不同，接下来就讲讲这不同之处。其语法为。

ECMAScript6let和const命令let用于声明变量，它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。{var a = 10;let b = 1;}console.log(a);// 10console.log(b);//b is not definedfor循环的计数器，就很合适使用let命令for(let i=0;i<10;i++){ console.log(i);}console.log(i);// i is not defi

asyncasync是es6中的一个关键字，它的作用是能将一个函数变成异步函数。其语法为async function fn(){}如此，fn函数就成为异步函数，我们可以用代码验证一下。 async function fn() { return 1; } console.log(fn());我们可以看到该函数的返回结果是一个promise对象，我们可以通过then方法获取其值。如果是普通函数返回的就是1，我们可以直接获取到值。根据上面的结果，我们也可以认为

JavaScript语言中的正则表达式借鉴于Perl语言。正则表达式是一种简单语言的语法规范，它以方法的形式被用于对字符串中的信息进行查找、替换和提取操作。在JavaScript中正则表达式相较于等小的字符串方法有性能优势。

客户端首先会访问最近的一台DNS服务器，如果最近的DNS服务器没有保存当前域名的信息，就会从顶层向下找，由于最近的DNS服务器中保存了根域DNS服务器的信息，因此它会将来自客户端的查询消息转发给根域DNS服务器。com域服务器接收请求，根据信息进行匹配，如果也没有，com域服务器会返回它下面的所保管次级域的DNS服务器的IP地址，DNS服务器接收到响应信息后，向下一级域名服务器发送查询请求。由于互联网中的域名数量庞大，所以把域名记录信息保存在多台DNS服务器中，保存形式以域名分层次的结构进行保存。

JavaScript：模拟拍照，持续更新中……

JavaScript：canvas图像操作，持续更新选中……

JavaScript：二维码的生成与解析

实现Promise，持续更新中……

canvas demo，制作简易春联，持续更新中……

canvas demo，给图片添加水印，持续更新中……

JavaScript：代码风格，持续更新中……

JavaScript继承，持续更新中

学习之路，长路漫漫，写学习笔记的过程就是把知识讲给自己听的过程。这个过程中，我们去记录思考的过程，便于日后复习，梳理自己的思路。学习之乐，独乐乐，不如众乐乐，把知识讲给更多的人听，何乐而不为呢?当前编程语言主要分为编译型语言和解释性语言。编译型语言的特点是在代码运行前编译器直接把代码转化为机器码。解释型语言也需要将代码转换成机器码，但是和编译型的区别在于运行时需要转换。

JavaScript语句，持续更新中……

JavaScript事件循环，持续更新中……

在JavaScript中，当我们创建变量时，系统会自动给对象分配对应的内存。基本类型的值在内存中会占据固定的内存空间，它们的值都保存在栈空间中，直接可以通过值来访问这些。而引用类型的值大小不固定，在栈内存中存放地址指向堆内存中的对象，是通过引用来访问的。栈内存中的基本类型，可以通过操作系统直接处理，而堆内存中的引用类型，正是由于可以经常变化，大小不固定因此需要JavaScript引擎通过垃圾回收机制来处理。

前端面试题|原理，手写JavaScript数组API，push、pop、map、reduce实现

JavaScript数组扁平化的实现，持续更新中……

前端面试题|原理JavaScript，new、call、apply、bind实现，持续更新中……