Web性能影响因素有多个方面，对应优化方案也有多个，今天聊的是缓存方向。 缓存也包括好多种（程序猿太难了），但概括地分就是服务端缓存和客户端缓存。 今天聊得是客户端缓存-浏览器缓存。 为区分两种缓存的差异，简单多说两句。 服务端缓存最常见、最简单的就是在咱们写的后台业务中加入缓存机制（其他方式的就不 ...
分类：
Web程序 时间：
2020-07-24 21:34:48
阅读次数：
92
前段时间优化一个公司历史老项目的Web性能，却引出了一系列的问题，让我反思良多。 我通过Chrome的Lighthouse工具可以看出一些性能参数和问题反馈，我逐一对其进行优化。 根据资源请求的不同，大致可以分为前端资源性能和后端程序性能两个方面。 先分析一下前端资源吧： Defer offscre ...
分类：
Web程序 时间：
2020-06-21 00:25:06
阅读次数：
69
前言 Http 缓存机制作为 web 性能优化的重要手段，对从事 Web 开发的小伙伴们来说是必须要掌握的知识，但最近我遇到了几个缓存头设置相关的题目，发现有好几道题答错了，有的甚至在知道了正确答案后依然不明白其原因，可谓相当的郁闷呢！！为了确认下是否只是自己理解不深，我特意请教了其他几位小伙伴，发 ...
分类：
Web程序 时间：
2020-06-03 20:04:51
阅读次数：
91
FE篇 基础知识 Web性能领域常见的专业术语 测量与排查网页的性能瓶颈，是一名专业Web性能优化者的基本功。 网页布局简史 你都经历过哪些布局方式呢？ 进阶知识 从敲下一行JS代码到这行代码被执行，中间发生了什么？ 我们每天都在写JS，你是否想过，计算机是怎么识别你的这一行代码，并且执行相应指令？ ...
分类：
其他好文 时间：
2020-05-12 13:28:43
阅读次数：
49
针对web页面的首屏加载问题，一直是个问题，为此还引出一个性能考量标准：白屏时间、首屏时间。 1.白屏时间 打开chrome控制台的Performance，我们可以看到页面的渲染快照： 这段白屏时间影响的因素归根结底就是：资源加载耗时较长（chunk.js文件下载耗时35.75s）； 而对于现在的大 ...
分类：
Web程序 时间：
2020-02-22 00:14:41
阅读次数：
227
前言 Http 缓存机制作为 web 性能优化的重要手段，对于从事 Web 开发的同学们来说，应该是知识体系库中的一个基础环节，同时对于有志成为前端架构师的同学来说是必备的知识技能。 但是对于很多前端同学来说，仅仅只是知道浏览器会对请求的静态文件进行缓存，但是为什么被缓存，缓存是怎样生效的，却并不是 ...
分类：
Web程序 时间：
2020-02-09 11:19:18
阅读次数：
64
从web现状谈及性能优化 原文出处：《Karolina Szczur: The State of the Web》 性能优化指南The Internet is growing exponentially, and so is the Web platform we create. Often tho ...
分类：
Web程序 时间：
2020-01-16 00:41:36
阅读次数：
106
一、减少请求资源大小或者次数 1、尽量和并和压缩css和js文件。（将css文件和并为一个。将js合并为一个） 原因：主要是为了减少http请求次数以及减少请求资源的大小 打包工具： webpack gulp grunt. ....2、尽量所使用的字体图标或者SVG图标来代替传统png图 因为字体图 ...
分类：
Web程序 时间：
2019-12-28 16:37:57
阅读次数：
129
DNS解析与ip url 统一资源定位符 它或许指定的是一个文件资源 或许是一个方法（比如接口） 为什么看到的网站会动呢 是因为浏览器可以解析html DNS 解析 ip地址 http权威指南 js引擎 301 302 域名服务器 ip服务器 cookie 是否合法 .cn .org .gov 最高 ...
分类：
Web程序 时间：
2019-12-28 16:16:33
阅读次数：
110
回流： 对于DOM结构中的各个元素都有自己的盒子模型，这些都需要浏览器根据各种样式（浏览器的、开发人员定义的等）来计算并根据计算结果将元素放到它该出现的位置，这过程称之为reflow（回流） 重绘： 当各种盒子的位置、大小以及其他属性，例如颜色、字体大小等都确定下来后，浏览器于是便吧这些元素都按照各 ...
分类：
Web程序 时间：
2019-12-28 16:05:48
阅读次数：
85
