码迷,mamicode.com
首页 > Web开发 > 详细

万树IT:【web前端】小技巧,你都掌握了吗?

时间:2018-04-17 19:53:01      阅读:262      评论:0      收藏:0      [点我收藏+]

标签:can   sse   关键字   设置   使用   存储   索引   dom节点   优化   


web前端开发,新的知识点,HTML5新标签、性能优化、new操作符、性能优化,这些知识点你都掌握了吗?
1
HTML5多功能增加
HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加。
(1)绘画canvas;
(2)用于媒介回放的video和audio元素;
(3)本地离线存储localStorage长期存储数据,浏览器关闭后数据不丢失;
(4)sessionStorage的数据在浏览器关闭后自动删除;
(5)语意化更好的内容元素,比如article、footer、header、nav、section;
(6)表单控件,calendar、date、time、email、url、search;
(7)新的技术webworker,websocket,Geolocation;
2
浏览器支持HTML5新标签
IE8/IE7/IE6支持通过document.createElement方法产生的标签,
可以利用这一特性让这些浏览器支持HTML5新标签,
浏览器支持新标签后,还需要添加标签默认的样式。
当然也可以直接使用成熟的框架、比如html5shim,
<!--[ifltIE9]>
<![endif]-->
3
简述一下你对HTML语义化的理解?
用正确的标签做正确的事情。
html语义化让页面的内容结构化,结构更清晰,便于对浏览器、搜索引擎解析;
即使在没有样式CSS情况下也以一种文档格式显示,并且是容易阅读的;
搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重,利于SEO;
使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。
4
性能优化有哪些方法?
(1)减少http请求次数:CSSSprites,JS、CSS源码压缩、图片大小控制合适;网页Gzip,CDN托管,data缓存,图片服务器。
(2)前端模板JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果,每次操作本地变量,不用请求,减少请求次数
(3)用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能。
(4)当需要设置的样式很多时设置className而不是直接操作style。
(5)少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。
(6)避免使用CSSExpression(css表达式)又称Dynamicproperties(动态属性)。
(7)图片预加载,将样式表放在顶部,将脚本放在底部加上时间戳。
5
JavaScript知识点
数据封装类对象:Object、Array、Boolean、Number和String
其他对象:Function、Arguments、Math、Date、RegExp、Error
1.eval是做什么的?
它的功能是把对应的字符串解析成JS代码并运行;
应该避免使用eval,不安全,非常耗性能(2次,一次解析成js语句,一次执行)。
由JSON字符串转换为JSON对象的时候可以用eval,varobj=eval(‘(‘+str+‘)‘)。
2.new操作符具体干了什么呢?
(1)创建一个空对象,并且this变量引用该对象,同时还继承了该函数的原型。
(2)属性和方法被加入到this引用的对象中。
(3)新创建的对象由this所引用,并且最后隐式的返回this。

万树IT:【web前端】小技巧,你都掌握了吗?

标签:can   sse   关键字   设置   使用   存储   索引   dom节点   优化   

原文地址:https://www.cnblogs.com/wanshuit/p/8868403.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!