CSS优化,提高性能的方法有哪些?
1,首推的是合并css文件,如果页面加载10个css文件,每个文件1k,那么也要比只加载一个100k的css文件慢。
2,减少css嵌套,最好不要套三层以上。
3,不要在ID选择器前面进行嵌套,ID本来就是唯一的而且人家权值那么大,嵌套完全是浪费性能。
4,建立公共样式类,把相同样式提取出来作为公共类使用,比如我们常用的清除浮动等。
5,减少通配符*或者类似[hidden="true"]这类选择器的使用,挨个查找所有...这性能能好吗?当然重置样式这些必须 的东西是不能少的。
6,巧妙运用css的继承机制,如果父节点定义了,子节点就无需定义。
7,拆分出公共css文件,对于比较大的项目我们可以将大部分页面的公共结构的样式提取出来放到单独css文件里, 这样一次下载后就放到缓存里,当然这种做法会增加请求,具体做法应以实际情况而定。
8,不用css表达式,表达式只是让你的代码显得更加炫酷,但是他对性能的浪费可能是超乎你的想象的。
9,少用css rest,可能你会觉得重置样式是规范,但是其实其中有很多的操作是不必要不友好的,有需求有兴趣的 朋友可以选择normolize.css
10,cssSprite,合成所有icon图片,用宽高加上bacgroud-position的背景图方式显现出我们要的icon图,这是一种 十分实用的技巧,极大减少了http请求。
11,当然我们还需要一些善后工作,CSS压缩(这里提供一个在线压缩 YUI Compressor ,当然你会用其他工具来压缩是十 分好的),
12,GZIP压缩,Gzip是一种流行的文件压缩算法,详细做法可以谷歌或者百度。
CSS优化,提高性能的方法有哪些?的更多相关文章
- 22 mysql有那些”饮鸩止渴”提高性能的方法?
22 mysql有那些”饮鸩止渴”提高性能的方法? 正常的短连接模式是连接到数据库后,执行很少的SQL语句就断开,下次需要的时候再重新连接.如果使用的是短连接,在业务高峰期的时候,就可能出现连接数突然 ...
- [日常工作]非Windows Server 系统远程经常断以及提高性能的方法
1. 公司内有不少windows xp windows 7 这样的操作系统的机器在机房里面用来跑自动化脚本或者是其他用处. 经常有人反馈机器过一段时间连不上, 其实这一点是一个非常小的地方 很多机器上 ...
- 如果要做优化,CSS提高性能的方法有哪些?
一.前言 每一个网页都离不开css,但是很多人又认为,css主要是用来完成页面布局的,像一些细节或者优化,就不需要怎么考虑,实际上这种想法是不正确的 作为页面渲染和内容展现的重要环节,css影响着用户 ...
- 《Mysql - 在Mysql服务出现瓶颈时,有哪些“饮鸩止渴”提高性能的方法?》
一:情景 - 业务高峰期,生产环境的 MySQL 压力太大,没法正常响应,需要短期内.临时性地提升一些性能. - 在业务高发时候,Mysql 服务压力过大,导致业务受损, 用户的开发负责人说,不管你用 ...
- 22 | MySQL有哪些“饮鸩止渴”提高性能的方法?
不知道你在实际运维过程中有没有碰到这样的情景:业务高峰期,生产环境的MySQL压力太大,没法正常响应,需要短期内.临时性地提升一些性能. 我以前做业务护航的时候,就偶尔会碰上这种场景.用户的开发负责人 ...
- Cocos2d-X中提高性能的方法
1)内存使用效率: 使用大纹理 场景切换时,要尽量使用replaceScene 2)用好缓存: CCTextureCache(纹理缓存) CCSpriteFrameCache(精灵帧缓存) CC ...
- [日常工作]GS使用消息队列进行凭证实时记账 提高性能配置方法
1. 安装消息队列服务 使用平台技术部的一键安装工具,安装. 自带jdk以及activeMQ 自动注册服务. 比较方便. 2. 修改/gsp/config下面的MQ配置文件,将消息队列服务修改为当前虚 ...
- Django性能优化的几种方法
1.一次性取出你所需要的数据 单一动作,需要多次连接数据库里的时候,最好一次性取出所有需要的数据,减少连接数据库的次数.此类需求推荐使用QuerySet.select_related()和prefet ...
- CSS基础以及兼容IE方法
1 介绍一下标准的CSS的盒子模型?与低版本IE的盒子模型有什么不同的? 标准盒子模型:宽度=内容的宽度(content)+ border + padding + margin低版本IE盒子模型:宽度 ...
随机推荐
- golang之select
2.switch语句 (1) (2) 3.select语句 4.for语句 (1)常规式 (2)条件式 (3) (4) goto break continue fallthrought ------- ...
- 当spark遇见hbase
一.使用sbt引入hbase依赖包 "org.apache.hbase" % "hbase-server" % "2.1.0", " ...
- FPGA按键功能
1.如何判断按键成功按下? 2.在什么时候采集数据? 按键在按下的过程中会产生大约2ms-3ms抖动,如果此时此刻采集数据来判断按键是不准确的,那么为了采集到准确的数据需要设置一个大约10ms左右的计 ...
- MVC开发模式与web经典三层框架
MVC:Model(模型)-View(视图)-Controller(控制器) ----是一种软件架构模式,一般把软件系统拆分为这三个层次. 视图View层:前端交互界面或者后端系统界面,它从模型中获取 ...
- 洛谷P1929 迷之阶梯
P1929 迷之阶梯 题目描述 在经过地球防卫小队的数学家连续多日的工作后,外星人发的密码终于得以破解.它 告诉我们在地球某一处的古老遗迹中,存在有对抗这次灾难的秘密武器.防卫小队立即赶 到这处遗迹. ...
- Leetcode876.Middle of the Linked List链表的中间节点
给定一个带有头结点 head 的非空单链表,返回链表的中间结点. 如果有两个中间结点,则返回第二个中间结点. 示例 1: 输入:[1,2,3,4,5] 输出:此列表中的结点 3 (序列化形式:[3,4 ...
- 廖雪峰Python总结3
1.模块简介 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件中,这样每个文件包含的代码相对来说就比较少.一个.py文件就称之为一个模块(Module). 使用模块的好处: 提高了代码的可 ...
- Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- Direct12优化
原文:Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- Direct12优化 第一章:向量代数 1.向量计算的时候,使用XMV ...
- js遮罩
1.1 背景半透明遮罩层样式 需要一个黑色(当然也可以其他)背景,且须设置为绝对定位,以下是项目中用到的css样式: /* 半透明的遮罩层 */ #overlay { background: #000 ...
- JavaScript实现,控制一个文本框只能输入正整数,如输入不符合条件则文本框全部字体标红
腾讯2014年研发职位笔试题Web前端方向简单题第一题. 代码: <html> <head> <title>test JavaScript</title> ...