前端优化

avoid empty image Src

避免将img的src属性设置为空白

Make favicon.ico Small and Cacheable

用更小的并且可缓存的 favicon.ico

keep Components under 25k

保持单个内容小于25K

Pack Components into a Multipart Document

打包组件成复合文本

Make Fewer Http Requests

尽可能减少HTTP请求数

CDN

使用CDN

Add Expires or Cache-Control Header

增加Expires Header Add an Expires Header

Reduce DNS Lookups

减少DNS查询 DNS域名解析系统

Put Stylesheets at Top

在顶部放置样式定义

Put Scripts at Bottom

在文档底部放置脚本定义或引用

Avoid CSS Expressions

避免使用CSS中的Expressions

Make JavaScript and CSS External

将脚本文件和样式表作为外部文件引用

Avoid Redirects

避免重定向

Minify JavaScript and CSS

最小化JAVASCRIPTCSS

Remove Duplicate Scripts

除重复的脚本,不光是文件,甚至是同功能的函数

Configure ETags

配置ETags

Make Ajax Cacheable

使AJAX调用尽可能利用缓存特性

Flush the Buffer early

尽可能早地发送缓冲区内容

User Get for AJAX Requests

为AJAX请求使用GET方法

Post-load Components

延迟或按需加载内容

Preload Components

预加载组件

No 404s

不要出现404页面

Reduce the Number of Dom Elements

减少DOM元素数量

Spilt Components Acorss Domains

跨域分离组件

Minimize the Number of iframes

减少iframe数量 需要更有效的利用ifames

Reduce Cookie Size

减小Cookie Cookie

Use Cokkie-free Domains for Components

对组件使用无Cookie的域名

Develop Smart Event Handlers

设计“智能”的事件处理程序

Don't Scale Images in HTML

不要在 HTML 中使用缩放图片

Minimize DOM Access

减少DOM的访问次数

Choose <link> over@import

@import使用< link >而非@import

Avoid Filters

避免过滤器的使用

Optimize Images

优化图片

Optimize CSS Sprites

优化CSS Sprites

本文分享自微信公众号 - 只喝牛奶的杀手(killerhub)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-03-30

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • CSS3 animation属性 实现地球转动

    用户5997198
  • 使用css transforms来创建一个漂亮的圆形菜单

    在这个教程里我们将向大家展示如何使用css transforms来创建一个漂亮的圆形菜单。我们将一步步的带你创建样式表,然后解释一些使用到的数学计算公式和简单逻...

    用户5997198
  • HTML5+CSS3响应式垂直时间轴,高端,大气

    HTML5+CSS3响应式垂直时间轴,使用了HTML5标签<section>,时间轴中所有的内容包括标题、简介、时间和图像都放在.cd-timeline-blo...

    用户5997198
  • 简单实用的纯CSS百分比圆形进度条代码解析/源码下载

    percircle是一款简单实用的纯CSS百分比圆形进度条插件。你不需要做任何设置,只需要按该圆形进度条插件提供的标准HTML结构来编写代码,就可以生成一个漂亮...

    用户5997198
  • 前端设计开发常用命名规则

    “container“ 就是将页面中的所有元素包在一起的部分,这部分还可以命名为:“wrapper“, “wrap“, “page“.

    用户5997198
  • jQuery和CSS3炫酷图片和按钮点击波特效源码

    ippler是一款效果非常炫酷的jQuery和CSS3图片和按钮点击波特效插件。点击波特效是指在按钮或图片上点击的时候,从点击的位置开始,会产生一种圆形光波向外...

    用户5997198
  • HTML5 Canvas和jQuery实时天气预报代码解析「附源码」

    这是一款非常有意思的纯CSS3扁平风格天气预报卡片动画特效。该天气预报特效将各种天气制作为卡片形式,包括下雨,闪电,白天,夜间和下雪。卡片使用扁平化风格,并使用...

    用户5997198
  • 简单的纯CSS3白云飘动背景特效

    这是一款非常简单的纯CSS3白云飘动背景特效。该白云飘动特效使用CSS animation动画来控制不同的白云,以不同的速度进行运动,形成白云飘动的效果。

    用户5997198
  • 又到公司年会时,给公司写的年会抽奖程序!

    用户5997198
  • 简单实用的商品购物和添加购物车UI设计

    这是一款使用jQuery和CSS3制作的简单实用的商品购物和添加购物车界面设计方案。用户可以在商品购物界面中预览各种型号、颜色、尺寸的商品。然后通过点击添加到购...

    用户5997198

扫码关注云+社区

领取腾讯云代金券