首页 >> 新闻动态 >>建站知识 >> ​大型网站建设:前端功能优化和标准要求
详细内容

​大型网站建设:前端功能优化和标准要求

时间:2020-02-23     作者:admin

Web功能触及的范围太广,但一般web开发者在程序上线今后许多都曾遇到过功能的问题。普遍表现为页面速度开端急剧变慢,正常访问时刻变的很长,或则干脆给你抛出反常过错页面。这里会触及到许多或许发作的状况,举例几个最主要发作的状况:
南京网站制作.jpg

* 数据库衔接超越最大限制,一般表现为程序的衔接池满,拒绝了与数据库的衔接。

* 数据库死锁

* Web Server 超越最大衔接数(一般在虚拟主机上才会限制)

* 内存泄漏

* Http衔接数太多,即访问量超越了机器和软件规划正常所能提供的服务

而今天共享的主要是比较倾向前端

浏览器恳求和响应的过程

第一步、浏览器预处理

查询Cache:读取Cache 或者发送304恳求

第二步、查询DNS优化规矩--削减DNS查找

DNS缓存

浏览器DNS缓存 计算机DNS缓存 服务器DNS缓存(TTL)

运用Keep-Alive特性

削减DNS查找

当客户端的DNS缓存为空时,DNS查找的数量与Web页面中仅有主机名的数量持平。削减仅有主机名的数量就可以削减DNS查找的数量。

较少的域名来削减DNS查找(2-4个主机)

第三步、树立衔接优化规矩-- 运用内容分发网络

美国十大Internet网站和CDN服务提供商

页面静态化,取决于发布系统

Ctrip运用的China-Cache和网宿

优化规矩--用域名划分页面内容

按页面内容划分域名,在合适的资源服务器上寄存文件

第四步、发送恳求优化规矩-- 削减HTTP恳求

HTTP恳求30-40,兼并文件,图片地图,内联图像

a)js文件(不超越7个)

1.tuna_090501_base.js和tuna_090501_module.js(拆分tuna_090501.js)

2。数据文件js(1-2个)

3。频道公用js(1个)和页面私有js(1-2个)

不含ga.js、uiscript.asp和外链其他网站的js

b) css文件不超越4个,各频道主页和全站主页不超越3个。

c) 现在无法处理的是allyes广告的恳求数。

• 大量的广告和产品图片或许会形成,图片恳求数很大,或许形成总恳求数指标吃紧,

这个只能从规划上搞定,需求权衡

• 现在老页面或许css和js文件恳求数或许会超支

优化规矩- – 优化CSS Spirite

图片地图 Ctrip主页比如

优化规矩– 防止404过错

防止内部无效的链接

规矩优化 –不要运用frameset,少运用iframe

搜索引擎不友好、

即时内容为空,加载也需求时刻、会阻止页面加载

禁止运用iframe引进外部资源,不包括allyes广告,不包括about:blank的空页面。

第五步、等待响应优化规矩 --防止重定向

在重定向结束并且HTML下载结束之前,是没有任何东西显示给用户的

触及服务器负载、数据查询、服务器端缓存等

第七步、接收数据

优化规矩 -- 紧缩组件

HTML文档、脚本和样式表、XML和JSON的文本响应 紧缩怎么作业

紧缩通常能将响应的数据量削减将近70%

优化规矩 -- 精简Javascript和Css

从代码中移除不必要的字符以削减其巨细,削减加载时刻。

规矩规矩– 尽量减缩页面巨细

页面有必要小于150K(不含图片)

a) 静态文件是否gzip

b) 图片是否紧缩优化过

第八步、读取Cache

优化规矩-- 添加Expire或Cache-Control

应用于不常常变化的组件,包括脚本、样式表、Flash组件、图片

Expires和Cache-Control

规矩规矩 -- 运用外部的Js和Css文件

尽或许运用外部Js和Css,因为咱们现在大部分Js和Css都做了Gzip和缓存技术,可以充分利用。

第九步、处理元素

不要对image和pdf等二进制文件进行gzip紧缩

第十步、烘托元素优化规矩 -- 将样式表放在顶部

界面原型页面有必要将样式表置于页面顶部,开发人员如无特殊原因也有必要将样式表置于顶部。

以往大都是因为masterpage原因无法将所有样式表置顶,在改版修正masterpage时,尽或许按照此原则进行规划。

优化规矩 – 主张将脚本放在底部

一般浏览器可以答应并行下载,取决于主机个数、带宽等

(默认状况下,IE是2个而FF是8个)

下载脚本时并行下载实际上是被禁用的。

优化规矩-- 移除重复脚本

有必要为0

优化规矩 -- 防止CSS表达式

影响浏览器烘托时刻

优化规矩 – 优化图像

尽量运用GIF和PNG

尽量运用png/gif格式的图片,png的图片优先,但是有必要注意如要兼容IE6,则png运用必定要注意透明问题。

图片在上次前必定要先用工具紧缩优化(png、jpg)

Javascript开发标准

大型的项目在前端 JS 方面有几个需求达成的目标:

代码逻辑分层防止全局变量便于多人协作开发各部分代码模块化,可以按需加载坚持全局变量的清洁可进行单元测试

南京隆讯科技有限公司

扫一扫关注我们

Copyright @ 2010 . All rights reserved. ICP备案:苏ICP备19028084号-2

底部导航

关于我们

联系我们

咨询电话:025-66914491

咨询热线:1314-512-8238

QQ:39337928

邮箱:39337928@qq.com
址:南京市江北新区星火E方1栋1620室

南京隆讯科技有限公司是中国移动应用解决方案提供商

客服中心
联系方式
025-66914491
1314-512-8238
- 客服小讯
扫一扫,关注我们
技术支持: 南京网站优化 | 管理登录
seo seo