手机白屏主要是因为页面渲染阻塞导致的,导致的原因有: 1:css文件加载需要一定的时间,在加载的过程中页面是空白的 解决:将css代码前置或者内联html 即使用<style> 2.可能是等待异步加载数据再渲染页面导致白屏,数据量大加载慢,导致数据没请求到阻塞页面渲染 解决:在手机显示的首屏时同步渲 ...
分类:
移动开发 时间:
2018-06-25 16:51:24
阅读次数:
254
1.减少DrawCall次数,最大化一次性传入数据给显卡避免使用glVertex之类,转而使用glDrawArray,对数据集进行批次传送.在这里它的作用不仅仅只是优化数据传递带宽需求,它更可以减少函数调用在系统当中的消耗(在某些系统下,消耗相当可观)2.减少OpenGL的状态变化尽可能将状态相近的图形绘制命令放在一起,减少OpenGL状态变化。使用状态集合,降低驱动程序的CPU处理时间,3.图元
分类:
其他好文 时间:
2018-05-19 21:55:10
阅读次数:
165
1.禁止使用iframe(阻塞父文档onload事件); *iframe会阻塞主页面的Onload事件; *搜索引擎的检索程序无法解读这种页面,不利于SEO; *iframe和主页面共享连接池,而浏览器对相同域的连接有限制,所以会影响页面的并行加载。 使用iframe之前需要考虑这两个缺点。如果需要 ...
分类:
其他好文 时间:
2018-03-13 13:54:59
阅读次数:
210
自学前端有一段时间了,在网上学习总结了点网页的渲染性能和JS性能提升的方法,有利于写出更加优秀的代码 1. 不要使用GIF图片实现loading效果,这样会降低CPU消耗; 2. 禁止使用iframe,会阻塞父文档onload事件;搜索引擎的检索程序无法解读这种页面,不利于SEO; 3. 使用CSS ...
分类:
Web程序 时间:
2018-03-09 01:38:13
阅读次数:
565
1.知识储备 CPU: 中央处理器,它集成了运算,缓冲,控制等单元,包括绘图功能.CPU将对象处理为多维图形,纹理(Bitmaps、Drawables等都是一起打包到统一的纹理). GPU:一个类似于CPU的专门用来处理Graphics的处理器, 作用用来帮助加快格栅化操作,当然,也有相应的缓存数据 ...
分类:
移动开发 时间:
2018-02-28 15:15:19
阅读次数:
259
最近烧包买了个2k显示器,发现跟win10使用,一堆问题,最大的就是字体,其实应该买4k,那样正好设置200%字体,现在设置的133% 以前使用的是mactype这个软件 https://pan.baidu.com/s/1c35m3DY 在1080p上面还好,在2k上面效果不咋地,不知道是不是眼睛没 ...
由于现在广泛使用的屏幕都有固定的刷新率(比如最新的一般在 60Hz), 在两次硬件刷新之间浏览器进行两次重绘是没有意义的只会消耗性能。 浏览器会利用这个间隔 16ms(1000ms/60)适当地对绘制进行节流, 因此 16ms 就成为页面渲染优化的一个关键时间。 尤其在异步渲染中,要利用 流式渲染 ...
分类:
其他好文 时间:
2018-01-11 11:37:29
阅读次数:
233
在项目中一般性能优化分为三种,资源优化、渲染优化、以及模型优化,在资源优化中,我们要保证我们的资源没有重复或多余,这就要在平时项目中仔细导入其他人所给的资源。渲染优化指的是在使用一些贴图的时候可以采用LOD等技术使模型面数减少以增加FPS帧率。并使用遮罩剔除等技..
分类:
编程语言 时间:
2017-10-17 20:01:54
阅读次数:
1559
本文主要想谈谈页面优化之滚动优化。 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的关系,节流与防抖,pointer-events:none 优化滚动。因为本文涉及了很多很多基础,可以对照上面的知识点,选择性跳到相应地方阅读。 滚动优化的由来 滚动优化其实也不仅仅指滚动(scroll 事件),还 ...
分类:
其他好文 时间:
2017-09-03 23:56:52
阅读次数:
225