分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 前端开发

全方位分析web前端如何进行性能优化

发布时间:2023-09-06 01:54责任编辑:顾先生关键词:前端性能优化

前言:

最近刚刚完成项目,空闲一段时间,想起之前有被问起怎么对前端进行性能优化,自己也是脑中零零散散的总不成体系,现特来总结,欢迎补充指教。

1、整体资源

  (1)js、css源码压缩

  (2)css文件放到文档顶部,js 文件放到文档底部

    因为浏览器渲染网页是自上而下的,用户第一眼见到的是页面,先加载页面相关的提高页面加载速度,另外避免js在页面没有完全加载完成操作DOM带来错误

  (3)进行CDN托管(具体可参看https://div.io/topic/930)

  (4)data缓存

2、css

(1)避免使用css expression (css 表达式) 

        微软在IE5时支持,IE8就不支持了,过老的内核,这个基本没有人会使用

 (2)使用CSS Sprites(图片精灵)

  将图片合到一张大图,并且控制图片大小(在满足显示的情况下,过大图片可以进行质量压缩),目的减小体积,减小http访问次数

 (3)js中动态改变元素样式时,使用类名修改,而不是直接在DOM中更改css 属性,避免页面进行重构

3、image

    (1)大型web应用中,可以搭建图片服务器,存放图片以及视频资源(具体实施请自行百度)

4、js

(1)模块化编程,养成封装方法的习惯,提高代码的重复利用率

(2)减少闭包的使用频率,减少内存占用

目前想到的是以上,欢迎补充和指教!

全方位分析web前端如何进行性能优化

原文地址:https://www.cnblogs.com/nana-share/p/9051435.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved