分享性能优化问题

谈谈性能优化问题

代码层面:避免使用css表达式,避免使用高级选择器,通配选择器。

缓存利用:缓存Ajax,使用CDN,使用外部js和css文件以便缓存,添加Expires头,服务端配置Etag,减少DNS查找等

请求数量:合并样式和脚本,使用css图片精灵,初始首屏之外的图片资源按需加载,静态资源延迟加载。

请求带宽:压缩文件,开启GZIP,

代码层面的优化

  • hash-table来优化查找

  • 少用全局变量

  • innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能

  • setTimeout来避免页面失去响应

  • 缓存DOM节点查找的结果

  • 避免使用CSS Expression

  • 避免全局查询

  • 避免使用with(with会创建自己的作用域,会增加作用域链长度)

  • 多个变量声明合并

  • 避免图片和iFrame等的空Src。空Src会重新加载当前页面,影响速度和效率

  • 尽量避免写在HTML标签中写Style属性

移动端性能优化

  • 尽量使用css3动画,开启硬件加速。
  • 适当使用touch事件代替click事件。
  • 避免使用css3渐变阴影效果。
  • 可以用transform: translateZ(0)来开启硬件加速。
  • 不滥用Float。Float在渲染时计算量比较大,尽量减少使用
  • 不滥用Web字体。Web字体需要下载,解析,重绘当前页面,尽量减少使用。
  • 合理使用requestAnimationFrame动画代替setTimeout
  • CSS中的属性(CSS3 transitions、CSS3 3D transforms、Opacity、Canvas、WebGL、Video)会触发GPU渲染,请合理使用。过渡使用会引发手机过耗电增加
  • PC端的在移动端同样适用

转载于:https://www.cnblogs.com/suajiu9/p/6388709.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/373000.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用Scala,Play和Akka连接到RabbitMQ(AMQP)

在本文中,我们将研究如何从Scala连接到RabbitMQ,以便可以从应用程序中支持AMQP协议。 在此示例中,我将使用Play Framework 2.0作为容器(有关更多信息,请参阅我在该主题上的其他文章 )在其中运行应用程序&am…

阿尔法贝塔阀原理_图总结 - 阿尔法个贝塔 - 博客园

一.思维导图二.概念笔记图的存储结构1. 邻接矩阵定义:设图G有n (n大于等于1) 个顶点,则邻接矩阵是一个n阶方阵。当矩阵中的 [i,j] !0(下标从1开始) ,代表其对应的第i个顶点与第j个顶点是连接的特点无向图的邻接矩阵是对称矩阵,n个顶点的无向图…

WebApi Post 后台无法获取参数的解决方案

事件回放: 之前一段时间,公司里前端用的Angularjs 发送http请求也是用的ng的组件,后台是.Net的WebApi 前端 var data {PArgs: {PageIndex: 0,PageSize: 8,RowsCount: 0} };$http.post("/Api/Test/ABC", data).success(function (d…

南京大学计算机系周小莉,周会群

媒体报道:南京大学周会群:用计算机聪明地做实验Q《中国教育网络》A周会群Q:南京大学的高性能计算中心非常特殊,分布在物理,化学、天文、地球科学四个不同的学科中,为什么采取这种模式?A&#xf…

不要怂,就是GAN (生成式对抗网络) (五):无约束条件的 GAN 代码与网络的 Graph...

GAN 这个领域发展太快,日新月异,各种 GAN 层出不穷,前几天看到一篇关于 Wasserstein GAN 的文章,讲的很好,在此把它分享出来一起学习:https://zhuanlan.zhihu.com/p/25071913。相比 Wasserstein GAN &#…

用于MyBatis CRUD操作的Spring MVC 3控制器

到目前为止,我们已经为域类“ User ”创建了CRUD数据库服务,并且还将MyBatis配置与Spring Configuration文件集成在一起。 接下来,我们将使用Spring MVC创建一个网页,以使用MyBatis CRUD服务对数据库执行操作。 使用MyBatis 3创建…

2pin接口耳机_拆解报告:雷柏首款真无线耳机XS200

-----我爱音频网拆解报告第185篇-----雷柏是一家历史悠久的鼠标和键盘厂商,截至目前,雷柏(rapoo)总共出了四款耳机,此前曾推出过三款蓝牙耳机, 分别是S500 蓝牙立体声麦克风耳机,S200 蓝牙立体声麦克风耳机&#xff0c…

html表单中阴影,html5中input表单加边框,阴影效果.doc

文档介绍:CSS:input:focus{border-color:#99;}获取焦点时改变颜色focus能同时改变宽度长度背景色…….form,p(margin-bottom:30px;margin-left:20px;).shadow,.one,.two,.three,.four,.five,.six( height:50px; width:280px; border:C;).shadow( -moz-box-shadow:C;…

带有GSON和抽象类的JSON

经过多年使用org.json库在Java中支持JSON数据交换格式后,我已切换到Google Gson 。 org.json是一个较低级的库,因此您必须创建JSONObject,JSONArray,JSONString等…并执行其他低级工作。 Gson简化了这项工作。 它提供了简单的toJs…

深入理解javascript原型和闭包(3)——prototype原型

转载,原文地址http://www.cnblogs.com/wangfupeng1988/p/3978131.html 既typeof之后的另一位老朋友! prototype也是我们的老朋友,即使不了解的人,也应该都听过它的大名。如果它还是您的新朋友,我估计您也是javascript的…

python 温度 符号_Python通过小实例入门学习---1.0(温度转换)

1.安装Python 3 下载地址: Welcome to Python.org​www.python.org 2.“温度转换”实例:摄氏度--->华氏度 / 华氏度--->摄氏度 TempConvert.py TempStr = input("请输入带有符号的温度值:") if TempStr[-1] in ["f","F"]:C = (eval(Tem…

mysql 修改root密码

1.找到配置文件my.ini ,然后将其打开,可以选择用记事本打开 C:\Program Files (x86)\MySQL\MySQL Server 5.0 2.打开后,搜索mysqld关键字,找到后,在mysqld下面添加skip-grant-tables,保存退出。 PS&#x…

联想计算机CDROM启动,联想电脑光驱启动问题?

1、开机按del键或f2进入bios设置(不同主板按键不一样,一般是DEL,也可能是F2,可以参考下主板说明),将计算机的启动模式调成从光盘启动。也就是从cdrom启动,根据主板的不同,bios设置有所差异(一般是&#xff…

没有J2EE容器的JNDI和JPA

我们希望通过尽可能简单的设置来测试一些JPA代码。 计划仅使用Java和Maven,不使用应用程序服务器或其他J2EE容器。 我们的JPA配置需要两件事才能成功运行: 数据库来存储数据, JNDI访问数据库。 这篇文章分为两个部分。 第一部分显示了如何…

string 大小写转换

STL的algorithm库确实给我们提供了这样的便利&#xff0c;使用模板函数transform可以轻松解决这个问题&#xff0c;开发人员只需要提供一个函数对象&#xff0c;例如将char转成大写的toupper函数或者小写的函数tolower函数。 transform原型&#xff1a; 1 #include <string&…

linux服务器上svn的log_如何在 Centos 8 / RHEL 8 上安装和配置 VNC 服务器 | Linux 中国...

在 Centos 8 和 RHEL 8 系统中&#xff0c;默认未安装 VNC 服务器&#xff0c;它需要手动安装。在本文中&#xff0c;我们将通过简单的分步指南&#xff0c;介绍如何在 Centos 8 / RHEL 8 上安装 VNC 服务器。-- Pradeep KumarVNC(虚拟网络计算Virtual Network Computing)服务器…

怎么把网页保存到本地计算机,在IE浏览器中,将网页保存到本地计算机中,若只需保存其中的文字、超链接和表格信息,应该选择的保存类型为( )...

2.(2017高一上东台月考)阅读下面一段资料&#xff0c;判断在给出的几种说法中不正确的是( )资料&#xff1a;IP电话与传统电话IP电话是按国际互联网协议规定的网络技术内容开通的电话业务&#xff0c;中文翻译为网络电话或互联网电话&#xff0c;它是利用国际互联网Inetrnet为…

html_博客博主

csdn: 工匠若水 http://blog.csdn.net/yanbober yunama: IT蓝豹&#xff1a;http://www.itlanbao.com/&#xff1b; http://ask.dcloud.net.cn/docs/; 博客园&#xff1a; https://www.cnblogs.com/guweiwei/category/965437.html转载于:https://www.cnblogs.com/awkflf11/p/55…

Windows上的Java线程CPU分析

本文将为您提供一个教程&#xff0c;介绍如何在Windows OS上快速查明Java线程贡献者与CPU严重问题有关。 Windows与Linux&#xff0c;Solaris和AIX等其他操作系统一样&#xff0c;使您可以在进程级别监视CPU利用率&#xff0c;还可以监视在进程中执行任务的单个线程。 在本教程…

flask 继承模版的基本使用1

转载于:https://www.cnblogs.com/wanghaonull/p/6399492.html