- 综合排序
- 最热优先
- 最新优先
- 来自专栏webTower
使用 centOS 7 部署前端项目
VNC 项目部署 部署之前需要先下载需要的软件，首先更新软件包： yum -y upgrade 下载一些软件： yum install git nginx openssl curl wget 下载 Nginx 我们的服务器上可能部署了好几个 web 服务器，它们有各自的端口，但是浏览器上访问时默认是 80 端口，这时可以将 Nginx 持有 80 端口，当客户端访问服务器时，先由 Nginx 识别请求 程序虽然部署到服务器上了，但是如果未来程序更新，再次上线时就需要来到服务器，下拉新的仓库代码，重新运行程序，而且单单使用 node 运行程序，在出现异常时，程序很可能会挂掉。 // 打包前端项目，最后使用 PM2 部署后端服务 'post-deploy' : 'npm install --registry=https://registry.npm.taobao.org 这条命令是在首次部署项目时运行的，之后的每次（包括这次）只需要运行下面的命令即可完成部署。
4.3K30发布于 2020-09-16 - 来自专栏亦枫的大佬之路
前端性能优化(21种优化+7种定位方式)
1.重要性： 关注前端可以很好地提高性能。如果我们可以将后端响应时间缩短一半，整体响应时间只能减少5%~10%。而如果关注前端性能，同样是将其响应时间减少一半，则整体响应时间可以减少40%~45%。 2.定位： 2.1 技术上的选择 在前端日常开发中，技术上的选择是非常重要的。为什么要讲这个呢？因为现象频发。 前端工程化严重的当下，轻量化的框架慢慢被遗忘掉了。 ： 前端的优化种类繁多，主要包含三个方面的优化：网络优化（对加载时所消耗的网络资源优化），代码优化（资源加载完后，脚本解释执行的速度），框架优化（选择性能较好的框架，比如benchmark）。 换一个角度来说，全量部署项目的情况，每次部署bundle包都将重新拉取。比较浪费资源。 react桶的方式可以命中强缓存，这样的化，就算全量部署也只需要重新拉取左侧1M的bundle包即可，节省了服务器资源。优化了加载速度。
13.2K76发布于 2020-10-28 - 来自专栏玩转大前端
前端优化
一、页面/文件级优化 1、减少HTTP请求数 解决方法： 1）设置缓存 2）css、js、img等静态资源合并压缩（vue的项目有压缩css和js） 3）懒加载图片（不是真正意义的减少请求数 （很久以前偶尔会出现这种情况） 7、将CSS和JS放到外部文件中：目的是缓存文件。 但有时候为了减少请求，也会直接写到页面里，需根据PV（访问次数）和IP的比例权衡。 （未使用过） 7、减少DOM元素数量：减少DOM数量，就会减少浏览器的解析负担 8、需绑定到DOM上面的事件多的时候使用事件代理 9、使用<link>替代@import（@import 进来的样式在页面内容载入完毕后再加载 1、返回状态保持功能 2、针对移动端各种屏幕尺寸的适配方案 3、webpack优化 4、将请求接口代码和加载动画及错误弹出提示封装成公共函数 5、统一前端常用组件规范。 前端规范：不同样式的组件图片使用一个大文件夹统一存放，里面分各种子类，每次更换只需更改文件夹名称即可实现更改一整套组件的样式的效果；使用vue.js框架的，这些组件都统一写成可复用组件（无需每次重复编写代码
79920编辑于 2022-08-15 - 来自专栏只喝牛奶的杀手
前端优化
的访问次数 Choose <link> over@import @import使用< link >而非@import Avoid Filters 避免过滤器的使用 Optimize Images 优化图片 Optimize CSS Sprites 优化CSS Sprites
65520发布于 2019-08-26 - 来自专栏Fantasy的技术小站
前端优化
前端优化是一个至关重要的过程，它不仅影响到网站的用户体验，还可能影响到网站的搜索引擎排名。 下面是一些常见的前端优化策略，以帮助提高页面的加载速度： 优化图片 压缩图片：使用工具或插件压缩图片，减小文件大小。 使用正确的格式：例如，使用 WebP 格式代替 JPEG 或 PNG。 使用 CDN（内容分发网络） 将静态资源（如图片、CSS、JavaScript）部署到 CDN，减少服务器的负担，并加快内容到用户的传输速度。 优化 CSS：将关键路径的 CSS 内联在 head 中。 浏览器缓存 通过设置 HTTP 头信息，使浏览器缓存静态资源，减少重复加载。 优化字体 选择高效的字体格式：例如，WOFF2。 在进行优化时，建议使用性能分析工具来监控和测试优化效果，确保每一步的改进都是有效的。
44820编辑于 2023-10-18 - 来自专栏CSDNToQQCode
前端性能优化-图像优化
2、图像优化 1) jpg or png 对于颜色较多的图像，使用jpg更好，因为png可以选择使用调色板颜色更多的png24，得到的图片比jpg大。
1.1K10编辑于 2022-11-29 - 来自专栏服务器运维笔记
【前端部署十二篇】使用 CI 中的缓存进行 Pipeline 优化
大家好，我是山月，这是我最近新开的专栏：「前端部署系列」。包括 Docker、CICD 等内容，大纲图示如下： 大纲 示例代码开源，置于 Github 中，演示如何对真实项目进行部署上线。 「前端部署」系列正在更新: 12/20 ---- 在上一篇文章提到 Lint/Test 在 CI Pipeline 不同的阶段共享资源目录需要利用 CI 中的 Cache。 如果每次可以将缓存取出来，则大大加速了前端部署的速度。 1. 不使用缓存的 Insall/Build 执行时间 以优化 npm run build 为例。 如果不进行任何缓存上的优化，仅需要 install/build $ yarn $ npm run build 翻译成 Github Actions: name: Build on: [push] jobs 利用缓存进行优化 如果可以对 node_modules 进行缓存，那么有以下两个好处 假设没有新的 package 需要安装，则无需再次 npm i/yarn 假设存有新的 package 需要安装，仅仅会安装变动的
1.8K10编辑于 2022-05-23 - 来自专栏逸鹏说道
漫谈前端优化
iphone4s诞生的时代，在中国高级智能设备开始被普遍使用，4G的覆盖范围也越来越大，各种app、移动站点、Html5活动页面也逐渐火爆起来；随着行业的发展，对从业者及技术支持的要求也越来越高；对于前端 ，前端资源和页面优化是常见要求，对比移动端，移动端对前端优化的要求更高，可以说要达到极致，虽然现在基本都有使用WIFI了，但一些地方还是要靠4G甚至3G、2G，极致的优化能争取更多的pv和更多的可能，如果你去观察一些大厂的项目和一些比较有名的站点 ，也会发现他们的优化是做的非常专业非常好的；而我今天跟大家聊的就是关于前端优化的内容； 话不多说，来看看有哪些选项； 1.引用资源部分优化： ·合并引用的css、javascript，并使用压缩模式 web图片优化应该是优化中的重头戏，内容型、展示型的站点图片规模很大，也许1%的优化作用就可以和其他的优化方式相媲美； ·使用css、svg、fonticon代替图片； ·压缩图片，重中之重，就图片本身格式而言 上传下载太麻烦了，使用它们给的开发者接口，个人实测跟gulp差不多，比不上网站上的压缩，所以意义不大，而且限制次数，土豪冲会员也许给的接口性能会优越也说不定哈)还有其他各种网络压缩工具不一一说了，这些是针对前端使用的图片的
1.2K90发布于 2018-04-11 - 来自专栏我的专栏2
前端性能优化
前端性能优化是提升用户体验、提高页面加载速度和响应速度的关键步骤。以下是一些核心优化策略和具体实现方法：一、加载性能优化1. 优化网络请求减少 HTTP 请求： 合并小文件（如雪碧图、合并 CSS/JS）。使用内联关键 CSS/JS（避免阻塞渲染）。
24300编辑于 2025-06-23 - 来自专栏lpp的专栏
前端性能优化
4. 我们应该如何使用LLM？好好写prompt就行？还是不管三七二十一，有钱任性！买卡！训练！？
13400编辑于 2024-04-18 - 来自专栏javascript艺术
前端性能优化
前端性能优化 三大优化思维： 性能优化目标 用户体验 代价与权衡 八处优化落点： HTML层级优化 CSS层级优化 JavaScript层级优化 渲染层级优化 交互请求优化 数据结构优化 前端缓存优化 前端性能瓶颈 传统DOM操作对性能的影响 浏览器的渲染过程 重排、重绘 前端性能优化与重绘与回流有关系的原因是：频繁的触发重绘与回流，会导致UI频繁染，最终会导致js变慢，会导致页面性能变差 （https://juejin.cn/post/6893681741240909832） CDN部署与缓存 内容分发网络。 采用轻量级数据交换格式 JSON 前后端联调对接那些事 前后端联调是前后端分离后的必然产物 前端和后端事先约定好固定的数据结构，前端通过Mock数据渲染，后端通过Postman等模拟前端请求。 MVVM框架 虚拟DOM Diff算法 移动端相关应用 骨架屏 PWA渐进式增强的Web应用 一个性能优良的Web前端产品，绝不是通过某一个或某几个优化方式就能达成的，它是一系列有意识的调整从量变到质变的一个过程
1.2K10发布于 2021-05-28 - 来自专栏Dawnzhang的开发者手册
前端性能优化
CDN 就是为了解决这一问题，在多个位置部署服务器，让用户离服务器更近，从而缩短请求时间。 如果用户访问的网站部署了 CDN，过程是这样的： 浏览器要将域名解析为 IP 地址，所以需要向本地 DNS 发出请求。 [hash:7]. 参考资料： web 前端图片懒加载实现原理 (2). 响应式图片 响应式图片的优点是浏览器能够根据屏幕大小自动加载合适的图片。 [hash:7].
1.8K20编辑于 2022-05-10 - 来自专栏李白偷偷偷猪
前端性能优化
页面级优化 css雪碧图 使用cdn加速器 压缩合并代码（使用webpack可打包合并） 使用dns域解析器 代码级优化 减少Dom操作 不使用css表达式，使用<link>，不使用@import 减小
61510编辑于 2022-11-14 - 来自专栏娜姐聊前端
前端性能优化
之前写过一篇文章前端网络高级篇（六）网站性能优化，里面提到过13个性能优化的点： 减少HTTP请求 使用CDN 利用HTTP缓存 Gzip压缩 将样式表放在顶部 将JS脚本放在底部 避免CSS表达式 使用外部 DOM编程优化 用JS操作DOM，是比较慢的。为什么呢？首先，补充一下浏览器相关的知识。下图为浏览器结构： ? 重排的开销要远大于重绘 所以，我们的优化点就是： 尽可能减少DOM操作 尽可能减少重排 看看下面的例子吧。 例子1： 在container元素里面添加10000个“hello”。 CSS优化 CSS选择器是从右向左解析的，所以，尽可能直接用class作为选择器，减少查询时间。
1.2K30发布于 2020-09-22 - 来自专栏我的专栏2
前端性能优化
一、加载性能优化 测试腾讯云开发者社区 减少 HTTP 请求 合并文件（CSS/JS 合并） 使用雪碧图（CSS Sprites） 内联小资源（如 Base64 图片或小字体文件） 代码分割与懒加载 第三方库按需引入（如 Lodash 的 lodash-es） 预加载与预获取 preload：提前加载关键资源（如字体、核心 CSS/JS） prefetch：预取未来可能需要的资源（如非首屏图片） 服务端优化 ：多路复用、头部压缩、Server Push 边缘计算：Vercel/Cloudflare Workers 实现就近处理 异步加载脚本 使用 async 或 defer 属性避免渲染阻塞 二、渲染性能优化 offsetHeight 后修改样式） GPU 加速 will-change: transform 或 translateZ(0) 触发独立渲染层 合理使用 CSS 动画代替 JS 动画 图片与媒体优化
28700编辑于 2025-11-21 - 来自专栏lpp的专栏
前端性能优化
一、加载性能优化adsgsdfgsdfgsdf // 生成最终签名 const sign = _this. 语法按需加载模块第三方库按需引入（如 Lodash 的 lodash-es）预加载与预获取preload：提前加载关键资源（如字体、核心 CSS/JS）prefetch：预取未来可能需要的资源（如非首屏图片）服务端优化 头部压缩、Server Push边缘计算：Vercel/Cloudflare Workers 实现就近处理异步加载脚本使用 async 或 defer 属性避免渲染阻塞 二、渲染性能优化 offsetHeight 后修改样式）GPU 加速will-change: transform 或 translateZ(0) 触发独立渲染层合理使用 CSS 动画代替 JS 动画图片与媒体优化懒加载
31410编辑于 2025-08-08 - 来自专栏lpp的专栏
前端性能优化
4. 我们应该如何使用LLM？好好写prompt就行？还是不管三七二十一，有钱任性！买卡！训练！？
13200编辑于 2024-02-19 - 来自专栏互联网杂技
前端各种优化
解决办法： 合并图片（css sprites），合并CSS和JS文件；图片较多的页面也可以使用 lazyLoad 等技术进行优化。 2. 如果Reflow的过于频繁，CPU使用率就会噌噌的往上涨，所以前端也就有必要知道 Repaint 和 Reflow的知识。 7. 将CSS和JS放到外部文件中引用，CSS放头，JS放尾 基本原理： 注：这个是很基础且必须遵循的知识点，可是为了文章的完整性勉为其难加进来吧，嘿嘿。 我个人经常使用的方式是使用 YUI Compressor，它的特点是：移除注释；移除额外的空格；细微优化；标识符替换。 关于图片精灵(Sprite)技术就和我们工作直接相关，不管是在CSS中的图片还是在HTML结构中的图片都会产生HTTP请求，前端优化的第一条就是减少请求数，最直接有效的方法是使用图片精灵（CSS Sprite
1.2K80发布于 2018-04-02 - 来自专栏CSDNToQQCode
前端性能优化
1、什么是前端性能优化？ 从用户访问资源到资源完整展现在用户面前的过程中，通过技术手段和优化策略，缩短每个步骤的处理时间从而提升整个资源的访问和呈现速度。 2、为什么要做前端性能优化？ 在构建web站点的过程中，任何一个细节都有可能影响网站的访问速度，如果不了解性能优化知识，很多不利于网站访问速度的因素会产生，从而严重影响网站的性能，导致网站访问速度变慢，用户体验低下，最终导致用户流失 3、如何进行前端性能优化 性能黄金法则：只有10%-20%的最终用户响应时间花在接收请求的HTML文档上，剩下的80%-90%时间花在HTML文档所引用的所有组件(图片，script，css，flash yahoo前端性能团队总结的35条黄金定律请见：http://blog.csdn.net/zhouziyu2011/article/details/60468287 1) 内容层面 ① DNS解析优化 b. cookie优化 去除没有必要的cookie，如果网页不需要cookie就完全禁掉。 将cookie的大小减到最小。
91951编辑于 2022-11-29 - 来自专栏grain先森
前端性能优化
本文主要考虑客户端性能、服务器端和网络性能，内容框架来自Yahoo Developer Network，包含 7 个类别共 35 条前端性能优化最佳实践，在此基础上补充了一些相关或者更符合主流技术的内容 以上数据更说明「加载时间就是金钱」，前端优化主要围绕提高加载速度进行。 一、页面内容 1. 减少HTTP请求数 Web 前端 80% 的响应时间花在图片、样式、脚本等资源下载上。 把内容部署在多个地理位置分散的服务器上能让用户更快地载入页面。但具体要怎么做呢？ 网站80-90%响应时间消耗在资源下载上，减少资源下载时间是性能优化的黄金法则。 7. 得益于Node.js的流行，开源社区涌现出许多高效、易用的前端优化工具，JavaScript 和CSS压缩类的，不敢说多如牛毛，多入鸡毛倒是一点不夸张，如[UglifyJS 2] (github.com
2.5K41发布于 2019-03-28
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号