摘要: 简要:整个在浏览器的渲染过程中(页面初始化,用户行为改变界面样式,动画改变界面样式等)reflow(回流)和repaint(重绘) 会大大影响web性能,尤其是手机页面。因此我们在页面设计的时候要尽量减少reflow和repaint。 什么是reflow和repaint(原文链接:http://ww 阅读全文
posted @ 2017-03-15 16:47 潇洒-zhutao 阅读(16929) 评论(0) 推荐(10) 编辑
摘要: 文档载入顺序如下: 地址栏输入url,浏览器下载html文档后开始解析:(参考链接:http://www.cnblogs.com/Peng2014/p/4687218.html) 1:首先形成dom tree 和 render tree。 1:在<head>里面发现了link,则浏览器会加载css样 阅读全文
posted @ 2017-03-14 19:36 潇洒-zhutao 阅读(1065) 评论(0) 推荐(1) 编辑
摘要: 简要:用户的体验是非常重要的环节。快速的显示网页,流畅的用户操作,丰富实时的页面功能,顺畅的动画展示,这些都是决定用户舒适体验的关键因素。把用户伺候舒服了,才会产生长久的依赖。我认为前端性能优化的实践应当是自动化的,智能化的,从代码编写到生产打包一整套流程都应该有一系列关于优化的应对方案。 我个人认 阅读全文
posted @ 2017-03-13 13:52 潇洒-zhutao 阅读(423) 评论(0) 推荐(1) 编辑
摘要: 简要:依赖fx.js,主要是针对show,hide,fadeIn,fadeOut的封装。 源码如下: $.fn.show: 先调用原方法显示出来,如果参数有speed,callback则先让元素变透明调用anim逐步将元素显示出来,最后调用callback回调方法。 $.fn.hide: 和$.fn 阅读全文
posted @ 2016-09-30 16:41 潇洒-zhutao 阅读(761) 评论(0) 推荐(0) 编辑
摘要: 简要:$.ajax是zepto发送请求的核心方法,$.get,$.post,$.jsonp都是封装了$.ajax方法。$.ajax将jsonp与异步请求的代码格式统一起来,内部主要是先处理url,数据和请求头部然后新建XMLHttpRequest对象发送请求。 代码如下: 大致流程如下: 1:根据$ 阅读全文
posted @ 2016-09-05 20:54 潇洒-zhutao 阅读(1935) 评论(0) 推荐(0) 编辑
摘要: 简要:jsonp是一种服务器和客户端信息传递方式,一般是利用script元素赋值src来发起请求。一般凡是带有src属性的元素发起的请求都是可以跨域的。 那么jsonp是如何获取服务器的数据的呢? jsonp先将指定的一个函数名作为url后面的参数传递到服务器,服务器取得函数名并将要传递的数据形成j 阅读全文
posted @ 2016-09-05 12:57 潇洒-zhutao 阅读(2233) 评论(0) 推荐(0) 编辑
摘要: 简要:ajax请求具有能够触发各类事件的功能,包括:触发全局事件,请求发送前事件,请求开始事件,请求结束事件等等,贯穿整个ajax请求过程,这是非常有用的,我们可以利用这些事件来做一些非常有意思的事情比如:拦截器,权限管理等等,另外$.ajax()貌似会返回一个异步请求对象xhr,这个xhr也是继承 阅读全文
posted @ 2016-08-31 15:20 潇洒-zhutao 阅读(1496) 评论(0) 推荐(0) 编辑
摘要: width height 模板方法 读写width/height /./ 是匹配除换行(\n)以外所有的字符,不加/g,只会匹配一个字符,这里匹配的是h或w var name = "height".replace(/./,function(m){ console.log(m); return m[0 阅读全文
posted @ 2016-07-19 16:23 潇洒-zhutao 阅读(821) 评论(0) 推荐(0) 编辑
摘要: index: obj.index(element) : 如果element有,则obj作为一个数组,取element在这个obj中的索引。如果element没有,则此函数的意思是取dom节点所在父类中的索引。 hasClass: array.some(function(curentValue,ind 阅读全文
posted @ 2016-07-12 10:20 潇洒-zhutao 阅读(615) 评论(0) 推荐(0) 编辑
摘要: $.each: 这里的elements可以是数组或者对象,如果是对象,则会将其原型里面的属性也遍历出来,最后返回elments本身,如果回调函数返回了false,则终止循环 remove: 这里的重点是parentNode.removeChild(this); 如果是没有父节点的这里不会执行。 is 阅读全文
posted @ 2016-07-08 21:57 潇洒-zhutao 阅读(353) 评论(0) 推荐(0) 编辑