性能优化和SEO

最新推荐文章于 2024-09-25 17:53:40 发布

weixin_30527143

最新推荐文章于 2024-09-25 17:53:40 发布

阅读量71

点赞数

文章标签：运维前端 ViewUI

原文链接：http://www.cnblogs.com/zz-zrr/p/9049515.html

版权

作为一个前端，能在性能上做的事无非是减少或者延迟HTTP请求、减少代码量和提高代码效率。减少请求的方式也就是合并js、css代码，图片合成图片精灵，有些小图片可以用base64代替，或者直接用css3来实现；把一些不在页面渲染时候需要的js代码（如googleAnalytics.js）放在body的最下面，这样不会影响页面的加载，用户不会因为js加载的未完成而影响阅读。减少代码量就是在压缩代码上下点功夫，有工具实现，很简单。
eg：
1.减少http请求数（性能优化的起点）
1，雪碧图技术 2.webpack打包技术，打包所有资源，只需要请求一次 3.缓存页面资源
2.压缩页面元素，如gzip服务器端压缩，压缩js文件，压缩css文件等
3.把样式表放在页面头部，可以提高界面加载速度
4.把js文件放在页面底部，防止阻塞
5.避免css表达式
6.ajax保存下来，缓存，如加载一个页面需要同时发送很多次相同的ajax，就将该ajax缓存下来，这里解释ajax原理
7.使用CDN（内容分发网络，CDN 是地理上分布的 web server集合，用于更高效地发布内容，通常基于网络远近来选择给具体用户服务的web server）
8.增加Expires Header
app.use(express.static(path.join(__dirname, 'public'), {maxAge:31557600000}));
9.把js和css放在外部文件中
10.减少DNS查询次数
11.最小化js代码
12.避免重定项

2.影响网页加载速度的因素。
1，网络最小带宽 2.DNS解析时间 3，http请求数多 4，加载的文件较多，如多个css，js文件 5.图片过大

SEO:

Seo分类：
白帽：改良和规范网站设计，使之对搜索引擎和用户更加友好，是一种搜索引擎推荐的做法
黑帽：利用或者放大搜索引擎的缺陷，使用不正当竞争获取更多的访问量。（例如最近花千骨电视剧热播，马上有一些网站使用这个标题标题，但是内容却是推销广告的，给广大网名造成很大困扰）。
前端seo做法：
1，网站标题、关键字、描述
2，网站内容优化
3，合理设置Robot.txt文件
4，生成对搜索引擎友好的网站地图
5，增加外链引用 其中最重要的是以下2个方面：
6，网站结构布局优化——扁平化布局：网站的目录层级要尽可能少，中小型网站不要超过3级 1，控制首页的链接数量（网站首页的权重最高 2，扁平化的目录层次。尽量让Spider跳转3次就可以到达网站的任意一个内页
7，网页代码优化 1，<head>标签放网页的标题，各个页面不同。 2，<meta keywords>列举出几个重要的关键词。 3，<meta description>网页内容的高度概括。 4， 标记应该放在文本中间，即使用 替代突兀的 标记。 5，html语义化。例如我们要做一个导航，可以使用div+span标记等

转载于:https://www.cnblogs.com/zz-zrr/p/9049515.html