首先要知道HTML的渲染过程、 解析HTML并构建DOM树和CSSOM树，浏览器对HTML标记转换成文档对象模型，CSS标记则转换成CSS对象模型（CSSOM），DOM 树包含了所有的 html 标签，包括不展示的 head 节点和 display:none 的节点，而 CSSOM 树则会去掉浏览器 ...
分类：
其他好文 时间：
2019-05-20 23:05:15
阅读次数：
250
<!--done--> 前面的话 与setTimeout和setInterval不同，requestAnimationFrame不需要设置时间间隔。这有什么好处呢？为什么requestAnimationFrame被称为神器呢？本文将详细介绍HTML5新增的定时器requestAnimationFra ...
分类：
其他好文 时间：
2019-05-11 21:27:53
阅读次数：
125
浏览器的渲染过程 本文先从浏览器的渲染过程来从头到尾的讲解一下回流重绘，如果大家想直接看如何减少回流和重绘，可以跳到后面。（这个渲染过程来自MDN） 从上面这个图上，我们可以看到，浏览器渲染过程如下： 渲染过程看起来很简单，让我们来具体了解下每一步具体做了什么。 生成渲染树 为了构建渲染树，浏览器主 ...
分类：
其他好文 时间：
2019-05-01 22:22:57
阅读次数：
160
之前几篇博客里的例子，大家运行过的话，就能看出来，界面是需要刷新的。 JPanel里的绘制方法是paintComponent，界面上的东西都是这个方法画出来的。 JPanel对象有一个repaint方法，从字面意思大家也看的懂，这个是重绘方法。 可以粗浅的这么认为：每调用一次repaint，就会执行 ...
分类：
编程语言 时间：
2019-04-25 10:28:55
阅读次数：
159
一、基本概念 浏览器从下载文件至本地到显示页面是个复杂的过程，这里包含了重绘和重排。在页面的生命周期中，一些效果的交互都有可能发生重排（Layout）和重绘（Painting），这些都会使我们付出高额的性能代价。 通常来说，渲染引擎会解析HTML文档来构建DOM树，与此同时，渲染引擎也会用CSS解析 ...
分类：
其他好文 时间：
2019-04-22 16:33:27
阅读次数：
279
一、关于canvas缩放 canvas图像缩放处理有两种思路： ctx.scale()，对整个canvas进行重绘，会导致每次缩放都重新加载，影响体验效果 在canvas外包层view，直接对外层的view进行缩放 二、view触摸事件 view组件借助RN自带的手势响应系统，已经有完善的触摸事件处 ...
分类：
其他好文 时间：
2019-04-16 16:14:57
阅读次数：
199
Hello 小伙伴们，如果觉得本文还不错，记得给个 star ， 你们的 star 是我学习的动力！GitHub 地址 本文涉及知识点： 防抖与节流 重绘与回流 浏览器解析 URL DNS 域名解析 TCP 三次握手与四次挥手 浏览器渲染页面 在本文中，jsliang 会讲解通过自我探索后关于上述知 ...
分类：
Web程序 时间：
2019-04-16 09:25:11
阅读次数：
304
一、问题描述 在画canvas时，遇到屏幕瞬间空白的情况（大约1~2帧），造成用户体验不好。 二、原因 canvas的绘图过程是：先擦出整个画布；然后浏览器到达重绘时间点后，在空白的canvas上作画；xx毫秒后，这一帧动画上的所有元件完成绘画。 那么，当采用setTimeout或setInterv ...
分类：
其他好文 时间：
2019-04-14 17:59:49
阅读次数：
246
Fragment之间切换时每次都会调用onCreateView方法，导致每次Fragment的布局都重绘，无法保持Fragment原有状态。 解决的办法是：在Fragment onCreateView方法中缓存View。 private View rootView;//缓存Fragment view ...
分类：
其他好文 时间：
2019-04-13 00:53:43
阅读次数：
206
问题一：在动态显示文本/数字的时候发现，显示对象闪烁 分析及解决办法：窗口管理器的默认特性是向每个需要重绘的窗口发送一条WM_PAINT 消息。这会导致闪烁效果。为抑制这些‘每个窗口’的闪烁效果，可为重绘操作自动使用内存设备。方法为，在创建窗口时设置标记WM_CF_MEMDEV 、使用函数WM_Se ...
