vite为什么速度快

原因

vite快的原因是因为 vite在开发环境中是使用的 esbuild,esbuild 是 go 写的,go = 编译型语言、多线程,nodejs = 解释型语言、单线程,并且 vite 使用了原生 esm 导入的,所以快一点,当然,这也只是开发环节,build 的时候vite使用的是 rollup ,回归js,打包速度并没什么提升

  1. esbuild 的优势
    • esbuild 使用 Go 语言编写,Go 语言天生支持多线程(goroutines)和并发,这使得 esbuild 在编译 JavaScript 和 CSS 时能够充分利用多核 CPU 的性能。
    • esbuild 专注于构建时的快速性能,采用了简单而高效的算法,避免了像 Babel 这样的工具在转换代码时可能产生的额外开销。
  1. Vite 的开发环境
    • Vite 在开发环境中使用原生 ES 模块(ESM)进行热模块替换(HMR),这避免了传统的打包步骤,从而大大加快了启动速度和模块更新速度。
    • Vite 利用了浏览器的原生 ESM 支持,将项目中的模块按需提供给浏览器,而不是将所有代码打包成一个或多个 bundle。
  1. Vite 的构建过程
    • 虽然 Vite 在开发环境中使用了 esbuild,但在生产构建时,它默认使用 Rollup 进行打包。Rollup 是一个专注于打包 ES6 模块的打包器,它本身并不比 webpack 或其他打包器快很多,但在配合 Vite 的优化策略(如预构建、依赖预处理等)时,可以提供不错的构建性能。
    • Vite 的构建性能并不是其主打优势,其主要优势在于开发环境的快速反馈和原生 ESM 的支持。然而,通过一些配置和优化,Vite 的生产构建也可以达到相当的性能水平。
  1. Node.js 的单线程与多线程
    • Node.js 本身是单线程的,但它是基于事件循环和非阻塞 I/O 设计的,这使得它能够在高并发环境下表现出色。此外,Node.js 可以通过 Worker Threads 实现多线程编程,但需要注意的是,这与 Go 语言的 goroutine 在设计和使用上有所不同。
    • 尽管 Node.js 在某些情况下可能不如 Go 语言快,但它仍然是一个强大且灵活的平台,特别适合构建 Web 应用程序和工具。

总之,Vite 的快速开发体验主要归功于其使用原生 ESM 和 esbuild 的优势,而在生产构建方面,虽然它默认使用 Rollup,但通过适当的配置和优化也可以实现不错的性能。

补充:

vite主要优化配置

  1. 基于ES模块的快速热更新:Vite 利用浏览器对 ES 模块的支持,能够在开发环境下实现近乎即时的模块热替换(HMR),无需打包整个项目,仅重新加载变更的模块,极大提高了开发速度。
  2. 按需编译:在开发模式下,Vite 对每个请求的模块进行即时编译,而不是像传统构建工具那样预先打包所有资源。这种方式减少了初次启动和更改后重新加载的时间。
  3. 预构建依赖:Vite 会在启动时预编译项目依赖到一个高效的格式,通常是 ES 模块格式,这样在开发过程中这些依赖就可以被浏览器直接加载,进一步加快加载速度。
  4. HTTP2 和缓存策略:Vite 利用 HTTP2 多路复用的特性,将多个模块请求合并到少量的连接中,减少网络延迟。同时,通过ETag和强缓存策略确保静态资源能够被有效缓存,提升加载速度。
  5. Rollup 打包:在生产构建时,Vite 使用 Rollup 进行代码打包,Rollup 以其高效的树摇(Tree Shaking)和代码分割能力著称,帮助减小最终输出的文件大小。
  6. 懒加载和代码分割:Vite 支持自动代码分割,允许将应用程序的不同部分拆分成单独的 chunks,仅在需要时加载,这对于大型应用来说可以显著提升初始加载速度。
  7. Vue 3 的原生支持:Vite 对 Vue 3 提供了原生支持,利用Vue 3的Composition API和其它性能优化特性,进一步提升Vue应用的运行效率。
  8. Dev Server 配置优化:Vite 的 dev server 配置简单且强大,提供了很多开箱即用的优化选项,比如对静态资源的处理、代理设置等,便于开发者根据需要进行微调。

事件循环和非阻塞 I/O

事件循环(Event Loop)和非阻塞 I/O(Non-blocking I/O)是现代异步编程模型中的两个核心概念,特别是在处理高并发或I/O密集型任务时。以下是它们的基本解释和关系:

事件循环(Event Loop)

事件循环是一个程序结构,它等待事件的发生(如用户输入、网络请求完成等),然后响应这些事件。在单线程环境中,事件循环特别有用,因为它允许我们在不阻塞主线程的情况下处理多个事件。

在事件循环中,通常会有一个事件队列(Event Queue),用于存储待处理的事件。当事件发生时,它们会被添加到事件队列中。事件循环会不断地从队列中取出事件,并执行相应的回调函数来处理这些事件。

非阻塞 I/O(Non-blocking I/O)

非阻塞 I/O 是一种I/O操作模式,它允许程序在等待I/O操作完成时不阻塞当前线程。与传统的阻塞I/O相比,非阻塞I/O可以提高程序的并发性和响应性。

在非阻塞I/O中,当程序发起一个I/O请求(如读取文件、发送网络请求等)时,如果I/O操作不能立即完成(例如,数据还没有准备好),程序不会阻塞等待,而是立即返回并继续执行其他任务。当I/O操作完成时,程序会收到一个通知(通常是通过回调函数或事件的方式),然后可以处理I/O操作的结果。

事件循环和非阻塞 I/O 的关系

事件循环和非阻塞I/O经常一起使用,以实现高效的异步编程。在基于事件循环的异步编程模型中,通常会使用非阻塞I/O来执行I/O操作。这样,当I/O操作不能立即完成时,程序可以继续执行其他任务,而不会阻塞等待I/O操作的完成。当I/O操作完成时,相应的回调函数会被添加到事件队列中,然后由事件循环来处理这些回调函数。

这种模型使得程序能够充分利用CPU和I/O资源,提高整体的并发性和响应性。它特别适合于处理大量并发请求或I/O密集型任务的情况。

示例(以Node.js为例)

Node.js 是一个使用事件循环和非阻塞I/O的JavaScript运行时环境。在Node.js中,你可以使用异步函数和Promise来处理异步操作,这些操作通常基于非阻塞I/O。当异步操作完成时,相应的回调函数或Promise的resolve函数会被调用,并添加到事件队列中等待事件循环的处理。这使得Node.js能够高效地处理大量并发请求,并成为构建高性能Web服务器和API的流行选择。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/20723.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

6.1Java方法

1、方法定义: 方法是一种语法结构,它可以把一段代码封装成一个功能,以便重复调用 方法的完整格式: 修饰符 返回类型 方法名(形参列表){ 方法体代码(需要执行的功能代码) return 返回值; } package com.define;public class …

【缓存】框架层常见问题和对策

缓存是为了加快读写速度,再了解redis这类框架层的缓存应用之前,我们不妨先思考下操作系统层面的缓存解决方案,这样有助于我们更深的理解缓存,哪些是系统层面的,哪些是服务层面。 以下是一些常见的缓存问题及其解决方案…

面向对象编程 (OOP):深入理解继承、多态和抽象

1. 简介 面向对象编程 (OOP) 是一种强大的编程范式,它通过将程序组织成对象的集合来简化软件设计和开发。与传统的程序设计方法相比,OOP 提供了一种更自然、更易于理解和维护的方式来构建复杂的软件系统。OOP 的核心概念包括:对象、类、继承、…

Java进阶学习笔记31——日期时间

Date: 代表的是日期和时间。 分配Date对象并初始化它以表示自标准基准时间(称为纪元)以来的指定毫秒数,即1970年1月1日00:00:00。 有参构造器。 package cn.ensource.d3_time;import java.util.Date;public class Test1Date {pu…

linux C/C++静态库制作

概念:程序在编译时会把库文件的二进制代码链接到目标程序中,这种方式称为静态链接。 如果多个程序中用到了同一静态库中的函数或类,就会存在多份拷贝。 特点: 静态库的链接是在编译时期完成的,执行的时候代码加载速度…

Java—异常处理

异常的结构图 异常知识点 异常分类: 按照在程序编译阶段是否被检查,异常分为编译时异常(Checked Exception)和运行时异常(Unchecked Exception)。编译时异常是指必须进行显式处理的异常,例如IOE…

【Linux】写一个日志类

文章目录 1. 源代码2. 函数功能概览3. 代码详细解释3.1 头文件和宏定义3.2 Log类定义3.3 打印日志的方法3.4 操作符重载和析构函数3.5 可变参数函数的原理 4. 测试用例 1. 源代码 下面代码定义了一个 Log 类,用于记录日志信息。这个类支持将日志信息输出到屏幕、单…

Java扩展机制:SPI与Spring.factories详解

一、SPI SPI全称Service Provider Interface,是Java提供的一套用来被第三方实现或者扩展的API,它可以用来启用框架扩展和替换组件。 整体机制图如下: Java SPI 实际上是“基于接口的编程+策略模式+配置文件”组合实现的动态加载机制。 系统设计的各个抽象,往往有很多不…

戴尔科技:一盆冷水浇醒了AIPC

这年头,只要沾上英伟达的公司,不论美股还是大A,都跟着鸡犬升天几轮过,但昨晚英伟达蒸发1064亿美元, 跟着遭罪的也不少,有没有一夜惊魂梦醒的感觉? 今天我们来说说——戴尔科技。 昨晚戴尔科技大跌5.18%&a…

5G无线标准演进综述及新技术引入

摘 要 随着经济和社会的发展,5G业务越来越丰富多彩,1080P高清视频、裸眼3D、网联汽车、云手机等新业务、新终端对网络的要求也越来越高;另一方面,5G标准持续演进,在MIMO、载波聚合、移动性管理、uRLLC、切片、定位等方…

你了解MySQL分区表吗?知道哪些情况不适用分区表吗?

一、分区表的使用 简单来说,分区表就是把物理表结构相同的几张表,通过一定算法,组成一张逻辑大表。这种算法叫“分区函数”,当前 MySQL 数据库支持的分区函数类型有 RANGE、LIST、HASH、KEY、COLUMNS。 无论选择哪种分区函数,都要指定相关列成为分区算法的输入条件,这些列…

ESP32开发笔记

ESP32 学习笔记 MQTT5 共享订阅 什么是共享订阅? 在普通的订阅中,每发布一条消息,所有匹配的订阅端都会收到该消息的副本。然而,当某个订阅端的消费速度无法跟上消息的生产速度时,我们无法将其中一部分消息分流到…

`nano` 文本编辑器快捷键使用

在 nano 文本编辑器中,可以帮助用户高效编辑文本,下面是每个快捷键的详细解释: 常用快捷键 ^G: Help - 显示帮助信息。这里的 ^ 代表 Ctrl 键,因此 ^G 就是 Ctrl G。^O: Write Out - 保存文件。^O 即 Ctrl O,用于将…

模仿库实现priority_queue

1 priority_queue 1.1 概念 优先级队列,一种大/小堆(默认为大堆) 1.2 大堆和小堆 一种完全二叉树,大堆根节点一定比子字节大 小堆根节点一定比子字节小 向下调整 从根节点开始比较与子节点的大小不断向下 向上调整 找到最后一个非叶子节点&#xf…

mac多媒体影音库:Emby for Mac 中文版

Emby软件是一款功能强大的媒体服务器软件,旨在为用户提供丰富的多媒体体验。以下是关于Emby软件的详细介绍: 下载地址:https://www.macz.com/mac/7964.html?idOTI2NjQ5Jl8mMjcuMTg2LjE1LjE4Mg%3D%3D 主要功能 媒体管理:Emby允许用…

代码随想录-Day25

216.组合总和III 找出所有相加之和为 n 的 k 个数的组合,且满足下列条件: 只使用数字1到9 每个数字 最多使用一次 返回 所有可能的有效组合的列表 。该列表不能包含相同的组合两次,组合可以以任何顺序返回。 示例 1: 输入: k 3, n 7 输…

Python OCR 图片转文字进阶:读光OCR之行检测模型+行识别模型

Python OCR 图片转文字进阶:读光OCR之行检测模型行识别模型 介绍阿里云文字识别OCR(读光OCR)前置条件模型1:行检测模型模型1:行识别模型 代码:main.py 介绍 什么是OCR? OCR是“Optical Charac…

Leetcode:字符串转换整数 (atoi)

题目链接:8. 字符串转换整数 (atoi) - 力扣(LeetCode) 普通版本(条件限制) class Solution { public:int myAtoi(string s) {int res 0;int i 0;int flag 1;//假设整数为正while(s[i] )//跳过空格{i;}if(s[i] …

德人合科技——@天锐绿盾 | -文档透明加密系统

天锐绿盾文档透明加密系统是一种先进的数据安全解决方案,旨在保护企业和组织的敏感信息,防止未经授权的访问和泄漏。 PC地址: https://isite.baidu.com/site/wjz012xr/2eae091d-1b97-4276-90bc-6757c5dfedee 以下是该系统的一些关键特点和功…

[C++11/14新特性] tuple元组介绍

C11 标准新引入了一种类模板,命名为 tuple(中文可直译为元组)。tuple 最大的特点是:实例化的对象可以存储任意数量、任意类型的数据。tuple 的应用场景很广泛,例如当需要存储多个不同类型的元素时,可以使用…