- 综合排序
- 最热优先
- 最新优先
- 来自专栏前端技术研究和应用
前端打包、编译和优化
打包目前前端世界主流的前 3 名模块打包器仍然是 Webpack 、 Rollup 和 Esbuild 。 这也优化了 Turbopack 使得开发过程中增量更新非常快，确保 dev server 能够快速响应代码变更。Turbopack 还使用请求级编译方法来只编译请求的代码。 在前端开发过程中，我们经常遇到如下两类编译场景：将 TS 转换为 JS；将新版本 JS 语法转换为低版本浏览器支持的语法；当前前端界的编译工具，如下四个占据了大部分市场：名称描述Star底层语言Babel ；综上，现在的前端 TS 项目一般还是会使用 Babel 做编译，使用 TSC 做类型检查。 Tree Shaking是Webpack里非常重要的优化措施，它的优化效果在Webpack 5中又得到了进一步的提升。
2.7K61编辑于 2023-03-06 - 来自专栏WriteOnRead
JVM笔记-前端编译与优化
Java 技术中的编译器可以分为如下三类： 前端编译器：把 *.java 文件转变为 *.class 文件的过程。比如 JDK 的 Javac。 其中后面两类都属于后端编译器。 本文主要分析前端编译器 Javac 的相关内容，后文再介绍后端编译器。 2. 2.2 注解处理器 JDK 5 提供了注解（Annotations）支持，JDK 6 提供了“插入式注解处理器”，可以在「编译期」对代码中的特定注解进行处理，从而影响前端编译器的工作过程。 常量折叠 该过程中，还会进行一个常量折叠（Constant Folding）的代码优化。 比如，我们在代码中定义如下： int a = 1 + 2; 在抽象语法树上仍能看到字面量 "1"、"2" 和操作符 "+"，但经过常量折叠优化后，在语法树上将会被标注为 "3"。
62110发布于 2020-04-22 - 来自专栏IT大咖说
原来前端工程的编译可以这样优化！
摘要 通过对压缩器、打包工具，以及模板引擎处理的讲解，来更深入的理解编译时优化是如何作用的。同时详细介绍了Vue是如何处理编译时优化的。以及未来前端领域在编译时上能做出那些更出色的优化。 嘉宾演讲视频及PPT回顾：http://suo.im/4TcEw 前端开发编译现况 在一段时间之前前端是没有编译这回事的，大部分人都是打开一个页面就开始写。 但是随着前端越来越复杂，开发前端时新增的部分越来越多，NodeJs、Webpack、BABEl等变得必不可少，同时Css也要进行预处理。到了现在编译已经成了前端开发中不可或缺的一环。 代码压缩其实就是一个构建时优化，我们通常使用的压缩器就相当于编译器，它将原生的代码压缩成更简洁、更轻量的形式。 由此我们可以从一直使用的压缩器中感受到编译时优化是怎么样的一个作用过程。
1.2K60发布于 2018-04-03 - 来自专栏前端开发面经
解读Vue3模板编译优化
今天的文章打算学习下 Vue3 下的模板编译与 Vue2 下的差异，以及 VDOM 下 Diff 算法的优化。 编译入口了解过 Vue3 的同学肯定知道 Vue3 引入了新的组合 Api，在组件 mount 阶段会调用 setup 方法，之后会判断 render 方法是否存在，如果不存在会调用 compile 方法将 ，compile 方法主要分为三步，Vue3 的逻辑类似：模板编译，将模板代码转化为 AST；优化 AST，方便后续虚拟 DOM 更新；生成代码，将 AST 转化为可执行的代码；参考vue实战视频讲解： /988545d612924fc48b7e033f6a24df81~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.image)render 优化Vue3 在虚拟 ，Vue3 还没正式发布的时候就有看到说 Diff 过程会通过 patchFlag 来进行性能优化，所以打算看看他的优化逻辑，总的来说还是有所收获。
84600编辑于 2022-10-10 - 来自专栏epoos.com
前端编译
前端编译的转变 前端开的主要编程语言是Javascript，Javascript是解释型语言，是不需要提前编译的，所谓开箱即用，因此前端行业（在很早之前）没有编译这回事。 因此，现在 Javascript 开发或者说前端开发逐渐变成了“非开箱即用”了。 编译是一个语言到另一个语言表达的转变，这里面不仅仅是功能上的应用，还可以给程序带来性能上的优化。 前端编译 前端编译主要功能 将框架(如 vue/react) 根据其特性语法进行模板解析、语法转换为常规 js。 将 es6、es7 等高版本 js 转换为所需要版本(如es5)的js语法 将 less、sass、css3 转换为 css 将图片压缩转换(如雪碧图、base64等) 将字体文件合并 将 js/css 前端编译原理 目前大多数编译过程都是先将源代码 Parser 成AST（抽象语法树），然后对 AST 进行分析，在这个分析过程中进行各种优化。 AST 是源代码语法结构的一种抽象表示。
1.2K10编辑于 2022-06-06 - 来自专栏vue3源码
vue3编译优化之“静态提升”
前言 在上一篇 vue3早已具备抛弃虚拟DOM的能力了文章中讲了对于动态节点，vue做的优化是将这些动态节点收集起来，然后当响应式变量修改后进行靶向更新。那么vue对静态节点有没有做什么优化呢？ 我们先来看看未开启静态提升之前生成的render函数是什么样的： 由于在vite项目中启动的vue都是开启了静态提升，所以我们需要在 Vue 3 Template Explorer网站中看看未开启静态提升的 vue3对此做出的优化就是将“执行createElementVNode方法生成h1标签虚拟DOM的代码”提取到render函数外面去，这样就只有初始化的时候才会去生成一次h1标签的虚拟DOM，也就是我们这篇文章中要讲的 child.tagType === ElementTypes.ELEMENT ) 在debug终端中来看看h1标签的constantType的值，如下： 从上图中可以看到h1标签的constantType值为3，
47310编辑于 2024-05-17 - 来自专栏Web大前端
Svelte框架：编译时优化的高性能前端框架
Svelte是一款新兴的前端框架，以其独特的编译时优化机制著称，能够在构建时将复杂的UI逻辑转换为高效的JavaScript代码，从而实现高性能的Web应用。 本文将深入解析Svelte的架构、核心概念以及代码优化策略。Svelte简介Svelte由Rich Harris于2016年创建，旨在解决传统前端框架在运行时性能上的瓶颈。 编译器：Svelte编译器将模板和组件转换为高效的JavaScript代码，用于浏览器执行。Svelte的编译时优化Svelte的性能优势主要来自于它的编译时优化。以下是几个关键的优化策略：1. `;}3. 计算属性缓存Svelte编译器会识别计算属性，并在值未变时复用旧值，避免重复计算。 模块化设计Svelte的组件化思想与微前端的模块化理念相吻合，每个子应用可以作为一个独立的组件库，方便在主应用中按需引入。3.
1.3K10编辑于 2024-06-12 - 来自专栏CSDN旧文
编译优化
1 #pragma comment(linker, "/stack:200000000") 2 #pragma GCC optimize("Ofast,no-stack-protector") 3 #pragma GCC target("sse,sse2,sse3,ssse3,sse4,popcnt,abm,mmx,avx,tune=native") 4 #pragma GCC optimize("unroll-loops
70320发布于 2020-10-29 - 来自专栏Java技术圈子
编译与优化
前端编译与优化 10.2.1 Javac的源码与调试 从Javac代码的总体结构来看，编译过程大致可以分为1个准备过程和3个处理过程，它们分别如下 所示。 1）准备过程：初始化插入式注解处理器。 3）插入式注解处理器的注解处理过程：插入式注解处理器的执行阶段，本章的实战部分会设计一个插入式注解处理器来影响Javac的编译行为。 4）分析与字节码生成过程，包括： 标注检查。 但在JDK 6中又提出并通过了JSR-269提案[1]，该提案设 计了一组被称为“插入式注解处理器”的标准API，可以提前至编译期对代码中的特定注解进行处理， 从而影响到前端编译器的工作过程。 如本章概述中所说的，在前端编译器中，“优化”手段主要用于提升程序的编码效率，之所以把Javac这类将Java代码转变为字节码的编译器称作“前端编译器”，是因为它只完成了从程序到抽象语法树或中间字节码的生成 本节将介绍几种HotSpot虚拟机的即时编译器在生成代码时采用的代码优化技术，以小见大，见微知著，让读者对编译器代码优化有整体理解。
65120编辑于 2023-02-28 - 来自专栏前端小歌谣
前端预编译流程
前言 我是歌谣 最好的种树是十年前 其次是现在 今天继续给大家带来的是预编译基础的讲解 环境配置 npm init -y yarn add vite -D 修改page.json配置端口 { 运行结果 案例2 function test(){ var a=b=1 } test() console.log(window.a) console.log(window.b) 运行结果 案例3 1; console.log(b) } test() //GO={ // b:1 //} //AO{ // a:undefined--->1 //} 运行结果 案例8 var b = 3 // a:undefined--->1---->function a()--->2 // b:undefined--->5 // //} //GO{ // b:undefined--->3 // //} 运行结果 案例10 function test(){ console.log(b) if(a){ var b=2 } c=3;
34641编辑于 2023-11-06 - 来自专栏玩转大前端
前端优化
一、页面/文件级优化 1、减少HTTP请求数 解决方法： 1）设置缓存 2）css、js、img等静态资源合并压缩（vue的项目有压缩css和js） 3）懒加载图片（不是真正意义的减少请求数 with加长了作用域链，eval和Function都是需要二次编译代码，损耗的性能更大） 3、减少Reflow和Repaint（二者都比较耗费性能） 解决方法： 1）使用改变类名的方式改变样式 ，降低维护成本）12、利用css继承减少代码：有一部分CSS代码是可以继承的，如果父代元素已经设置了该样式，后代元素就不需要去设置该样式，例如文字的样式：font-size、color等 三、业务功能优化 1、返回状态保持功能 2、针对移动端各种屏幕尺寸的适配方案 3、webpack优化 4、将请求接口代码和加载动画及错误弹出提示封装成公共函数 5、统一前端常用组件规范。 前端规范：不同样式的组件图片使用一个大文件夹统一存放，里面分各种子类，每次更换只需更改文件夹名称即可实现更改一整套组件的样式的效果；使用vue.js框架的，这些组件都统一写成可复用组件（无需每次重复编写代码
79220编辑于 2022-08-15 - 来自专栏只喝牛奶的杀手
前端优化
的访问次数 Choose <link> over@import @import使用< link >而非@import Avoid Filters 避免过滤器的使用 Optimize Images 优化图片 Optimize CSS Sprites 优化CSS Sprites
65120发布于 2019-08-26 - 来自专栏Fantasy的技术小站
前端优化
前端优化是一个至关重要的过程，它不仅影响到网站的用户体验，还可能影响到网站的搜索引擎排名。 下面是一些常见的前端优化策略，以帮助提高页面的加载速度： 优化图片 压缩图片：使用工具或插件压缩图片，减小文件大小。 使用正确的格式：例如，使用 WebP 格式代替 JPEG 或 PNG。 优化 CSS：将关键路径的 CSS 内联在 head 中。 浏览器缓存 通过设置 HTTP 头信息，使浏览器缓存静态资源，减少重复加载。 优化字体 选择高效的字体格式：例如，WOFF2。 使用 HTTP/2 或 HTTP/3 利用这些协议的多路复用特性，允许单一连接上并行请求多个资源。 在进行优化时，建议使用性能分析工具来监控和测试优化效果，确保每一步的改进都是有效的。
43820编辑于 2023-10-18 - 来自专栏全栈前端精选
Vue3 在编译优化方面做的努力 | HcySunYang
在大会上，来自 Vue.js 核心团队成员霍春阳（HcySunYang）分享了《Vue3 在编译优化方面做的努力》，相信很多同学或多或少的都了解过 vue3 在编译方面配合运行时做了很多性能优化方面的努力 ，本次分享的主题将会详细探讨实现优化的思路、问题以及应对方法，和对模板能力的探索。
68520发布于 2021-09-03 - 来自专栏Vue中文社区
Vue3 在编译优化方面做的努力 | HcySunYang
在大会上，来自 Vue.js 核心团队成员霍春阳（HcySunYang）分享了《Vue3 在编译优化方面做的努力》，相信很多同学或多或少的都了解过 vue3 在编译方面配合运行时做了很多性能优化方面的努力 ，本次分享的主题将会详细探讨实现优化的思路、问题以及应对方法，和对模板能力的探索。
48010发布于 2021-07-05 - 来自专栏逮虾户
AndResGuard编译速度优化
只有了解了完整的ARG的流程之后，我们才可以对其进行二次开发和二次优化。首先当然先是设立目标了，我们要做什么，然后可以怎么做？ TODO 我们打算做些什么？ 如何更改编译任务的执行顺序 在对Aab的代码分析过程中，我们其实发现了一些很神奇很微妙的点，对于我们后续的优化产生了重大的启发。 第一个任务完成 从上述流程走通之后，我们只要把ARG的代码进行二次开发，根据对应task任务进行优化，这样我们的第一个任务也就完成了。 Main.gradleRun(inputParam) } return null } 这个就是ARG调用资源文件混淆的代码了，我们基本不需要对其进行大改造就能把这个编译的优化完成了 我们是不是可以考虑直接把任务执行在线程内，这样下一个task就可以继续执行了，只要在编译完成之前把任务执行好是不是就可以把这部分资源混淆的时间也给优化掉呢，说干就干，直接上代码。
1K30编辑于 2023-10-16 - 来自专栏linux驱动个人学习
Makefile优化编译速度
并行编译：使用 make -j 命令来进行并行编译，可以加快编译速度。-j 后面可以跟一个数字，表示并行编译的线程数。 懒惰计算：使用 .PHONY 规则来避免无谓的重新编译。 例如：\ .SUFFIXES: 指定编译器选项：使用 -O 开启编译器优化选项，可以提高程序执行速度。 例如： CFLAGS=-O all: hello.c gcc $(CFLAGS) -o hello hello.c 分离头文件：将头文件和源文件分离，可以避免重复编译，减少编译时间。 myprog hello.o main.o hello.o: hello.c hello.h gcc -c hello.c main.o: main.c hello.h gcc -c main.c 使用预编译头文件 ：将常用的头文件编译成单独的预编译头文件，可以加快编译速度。
82530编辑于 2023-07-09 - 来自专栏鹅厂少年的奇妙之旅
GCC编译优化选项
GCC编译优化选项 参考GCC文档 http://gcc.gnu.org/onlinedocs/gcc/Optimize-Options.html. 分为如下: O0: 默认选项，目的: 减少编译时间;生成可调试代码(可打断) O/O1: 做一些不显著增加编译时间的优化 O2: 显著提升编译时间，提升代码性能，做不包含`space-speed tradeoff `的所有优化 O3: 进一步优化，显著增加可执行文件大小。 Os: 优化性能同时不增加可执行文件大小。包含O2选项中不增加代码大小的优化项 Og: 优化性能同时不损害可调试性。包含O1选项中不损害可调试性的优化项 Ofast: 忽视严格的标准编译性。 ，主要因为: 前期Gcc版本中，O3 is buggy O3往往优化后比O2还要慢一些 第2点，主要是因为，O3在做优化时，采用了很激进的策略，例如激进的循环展开、函数内联等，导致生成的代码比较大，可能超出了
8.6K51发布于 2019-01-03 - 来自专栏Elton的技术分享博客
MySQL 编译参数优化
适当的调整MySQL的编译参数，可以极大的提升MySQL的性能，官方文档说可以提升10-30％的性能。 with-client-ldflags=-all-static –with-mysqld-ldflags=-all-static 静态链接提高13%性能 -pgcc 1% CFLAGS=”-O3 -mnocona -mstack-align-double” CXX=gcc CXXFLAGS=”-O3 -mnocona -mstack-align-double -felide-constructors mysql/tmp/mysql.sock 使用unix套接字链接提高7.5%性能，所以在windows下mysql性能肯定不如unix下面 –enable-assembler 允许使用汇编模式(优化性能 ) CFLAGS="-O3 mnocona" CXX=gcc CXXFLAGS="-O3 mnocona -felide-constructors -fno-exceptions
2.2K30发布于 2021-01-22 - 来自专栏运维研习社
Nginx编译安装优化
nginx安装有两种访问，一种是利用包管理器直接安装，也是新手最简单的安装方式，另一种是源码包编译安装。 源码包编译安装的有点就是灵活，扩展方便，且据说性能要比直接包管理器安装要好，对于很多人说的包管理器安装无法安装最新版、无法升级到最新版等问题，纯属扯淡，不存在，只要你能找到一个好的源。 但是今天主要讲编译安装nginx的一些方法。网上有很多编译安装教程，也有一键安装包，这里不再长篇大论的描述nginx整个编译安装的步骤，只说几个编译安装的小方法。 减小可执行文件 默认的nginx编译选项里使用debug模式的，会插入很多不必要的内容，编译以后文件有好几兆，所以这里去掉nginx的debug模式编译，完成后可执行文件只有几百K。 如同注释掉图上的一行，重新编译。 ? 如图，编译后只有880K。
95310发布于 2021-02-23
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号