floated - 博客园

2018年11月6日

摘要： cross-env能跨平台地设置及使用环境变量在windows系统上，我们使用： "SET NODE_ENV=production && webpack --config build/webpack.config.js" 在类unix系统和安装并使用了bash的windows的系统上，我们会使用: 阅读全文

posted @ 2018-11-06 11:47 floated 阅读(1372) 评论(0) 推荐(0) 编辑

2017年11月12日

虚拟DOM（转载）

摘要： 1.为什么需要虚拟DOM DOM是很慢的，其元素非常庞大，页面的性能问题鲜有由JS引起的，大部分都是由DOM操作引起的。如果对前端工作进行抽象的话，主要就是维护状态和更新视图；而更新视图和维护状态都需要DOM操作。其实近年来，前端的框架主要发展方向就是解放DOM操作的复杂性。 2.理解虚拟DOM 虚阅读全文

posted @ 2017-11-12 22:42 floated 阅读(141) 评论(0) 推荐(0) 编辑

为什么说DOM操作慢

摘要： DOM对象本身也是一个js对象，所以严格来说，并不是操作这个对象慢，而是说操作了这个对象后，会触发一些浏览器行为，比如布局（layout）和绘制（paint）浏览器是如何呈现一张页面的一个浏览器有许多模块，其中负责呈现页面的是渲染引擎模块，比较熟悉的有WebKit和Gecko等，这里也只会涉及这阅读全文

posted @ 2017-11-12 22:38 floated 阅读(260) 评论(0) 推荐(0) 编辑

2017年10月11日

vue中自定义指令

摘要：指令：可以添加到Dom元素的微命令，通常以“v-”作为前缀 Vue自定义指令如下： Vue.directive(id, definition), id是指指令Id, definition是指定义对象，其中，定义对象可以提供一些钩子函数钩子函数定义对象的钩子函数如下钩子函数参数阅读全文

posted @ 2017-10-11 16:57 floated 阅读(96) 评论(0) 推荐(0) 编辑

2017年3月19日

前端性能优化总结

摘要：（1）减少http请求次数：CSS Sprites, JS、CSS源码压缩、图片大小控制合适；网页Gzip，CDN托管，data缓存，图片服务器。（2）前端模板 JS+数据，减少由于HTML标签导致的带宽浪费，前端用变量保存AJAX请求结果，每次操作本地变量，不用请求，减少请求次数（3）用i 阅读全文

posted @ 2017-03-19 20:37 floated 阅读(123) 评论(0) 推荐(0) 编辑

前端性能优化---选择器优化

摘要： 1.id选择器肯定是最快，但是不要在ID选择器使用的同时再使用标签或类选择器了，这点上jquery也是一样的。不要出现这样的写法 "div#content" 或者 "#content.text"。David Hyatt的第一段话中有说到了，样式系统从最右边的选择符开始向左进行匹配规则。只要当前选择符阅读全文

posted @ 2017-03-19 20:34 floated 阅读(377) 评论(0) 推荐(0) 编辑

前端性能优化–缓存

摘要： JS文件放尾部，CSS文件放头部等，这些基本的优化点还是可以做到，但是有时候遇到网速慢的情况，会出现一段时间的白屏，从用户体验的角度来说，还是有提升的空间。根据移动站点的特性，已经用户对页面的期待看来，用户在刚打开页面的时候可以接受旧的东西。在加载完js等资源文件时可以更新新的内容。这样，就可以阅读全文

posted @ 2017-03-19 20:30 floated 阅读(814) 评论(0) 推荐(0) 编辑

前端性能优化---减少HTTP请求

摘要： http请求 http协议是无状态的应用层协议，意味着每次http请求都需要建立通信链路、进行数据传输，而在服务器端，每个http都需要启动独立的线程去处理。这些通信和服务的开销都很昂贵，减少http请求的数目可有效提高访问性能。网页中的的图片、form、flash等等元素都会发出http请求 ht 阅读全文

posted @ 2017-03-19 20:01 floated 阅读(569) 评论(0) 推荐(0) 编辑

javascript中的数据类型转换

摘要： JavaScript中的数据类型有：1、数组 2、字符串 3、布尔 4、函数 5、对象（【】，{}，null）、undefined; JS 数据类型转换方法主要有三种：转换函数、强制类型转换、利用js变量弱类型转换。 1. 转换函数： js提供了parseInt()和parseFloat()两个转阅读全文

posted @ 2017-03-19 13:53 floated 阅读(237) 评论(0) 推荐(0) 编辑

Position定位知识点总结

摘要： Position:relative相对定位的特征 1、不影响元素本身的特征 2、不使元素脱离文档流（元素移动之后原始位置会被保留） 3、如果没有定偏移量，对元素本身没有任何影响 4、提升层级 Position:absolute 绝对定位 1、使元素完全脱离文档流 2、使内嵌支持宽高 3、块属性标签内阅读全文

posted @ 2017-03-19 12:01 floated 阅读(341) 评论(0) 推荐(0) 编辑