8 可乐少点冰

尚未进行身份认证

我要认证

暂无相关简介

等级
TA的排名 3w+

webpack优化

webpack优化小结测量打包速度配置loaderDLL、Externals多进程使用缓存多进程代码压缩测量打包速度speed-measure-webpack-plugin插件progress-bar-webpack-plugin插件--report-json 命令参数配置loader优化搜索时间、缩小文件搜索范围、减少不必要的编译工作DLL、Externals原理都是减少第三方库的编译多进程thread-loader(v4以后的官方推荐)happypack(不怎么维护了

2020-10-10 18:08:30

发布插件(组件)到npm

接着上一篇vue中编写通过方法调用的组件我们已经开发完成一个插件,接下来将其发布到npm,供他人使用同时也方便后续其它地方复用。接下来的打包主要是使用vue-cli3脚手架搭建的环境。cli2的打包发布可以看这篇文章 教你一步步封装vue组件并发布到npm。1、修改项目package.jsonvue-cli 3.x 提供了构建目标的命令,不用再去配置webpack.config,直接新增命令搞定target: 默认为构建应用,改为 lib 即可启用构建库模式name: 输出文件名.

2020-09-27 14:17:30

实用库

资源预加载库 preload.js页面滚动动画 wow.js

2020-09-18 16:15:46

前端异常处理

捕获异常js同步异常js异步异常资源加载异常Promise异常try…catch…√√window.onerror√√window.addEventListener(‘error’)√window.addEventListener(‘unhandledrejection’)√try catch捕获当前调用栈中的错误,因此无法捕获异步异常(抛出错误时try catch调用栈已经执行完毕退出。同时捕获后,异常不会向上继续抛出 ...

2020-08-11 18:33:25

通过二进制获取图片格式以及宽高

通过把文件的二进制数据转为16进制字符转再进行相应的判断获取图片格式以及宽高等二进制转字符串通过readAsBinaryString转换blob对象为二进制字符串通过charCodeAt转换二进制字符串为Unicode码将Unicode码转换为16进制async blobToString(blob){ return new Promise(resolve=>{ const reader = new FileReader() reader.o.

2020-07-14 18:45:38

深入理解浏览器垃圾回收机制(V8)

文章目录栈堆堆的垃圾回收优化效率栈定义栈用来在函数执行时存储保存执行上下文环境,我们一般也称调用栈,如基本类型的变量,引用类型的引用地址等都保存在栈中。执行到当前函数时进行入栈,执行完毕进行出栈。回收方式有一个记录当前执行状态的指针(称为 ESP)指向活动栈,函数执行完毕,esp下移到后一节点,销毁当前函数执行上下文。新的函数执行上下文入栈直接覆盖掉销毁的空间即可 .function test() { const a = { name: 'a' }; function showNam

2020-06-18 17:47:53

一文搞定babel转换

babel转换流程code转换为AST => 遍历AST树、进行修改 => 还原为codebabel结构@babel/core AST转换的核心@babel/cli 打包工具@babel/plugin* Babel 插件机制,Babel基础功能不满足的时候,手动添加些@babel/preset-env 预设插件集,减少配置各类插件@babel/polyfill 把浏览器某些不支持API,兼容性代码全部导入到项目,不管你是不是用到,缺点是代码体积特别大@b

2020-06-10 18:40:17

webpack热更新思维图

2020-05-20 18:16:06

Vue组件文档自动化生成库

一个可以提供自动化文档的生成,并提供组件预览,这个库叫做 Vue Styleguidist使用参考 使用Vue Styleguidist编写组件文档

2020-05-20 12:22:12

记一次web性能优化实战

效果展示优化前优化后可以看到优化前有明显的延迟,详细信息才出现。优化后详细信息基本秒现。问题分析出现数据显示有明显的延时的情况,我们分析大方向可能有接口缓慢网络问题前端问题渲染问题:渲染节点过多、重排、重绘等js阻塞页面渲染原因定位1、查看network最大值784ms,因此可以排除接口和网络问题2、使用performance记录一次过程可以看到js耗费将近14s。此处可能由于performance记录需插入很多记录钩子所以比正常范围时间耗费要放大很

2020-05-12 17:26:25

Vue实例化过程

参考:Vue原理解析

2020-03-23 17:14:22

css层叠上下文和层叠水平

页面中当元素发生层叠时如何显示。为何有的元素明明写在后面却被前者覆盖住了?为何z-index设置很大了,还是不显示?这些涉及到css中的层叠上下文,层叠水平等层叠上下文类似块级格式化上下文,是一个封闭的空间,用来限制内部元素的层叠水平在当前范围活动的。在同一个层叠上下文中,(元素、层叠上下文)的层叠水平按一定的规则排序、显示。创建方式: 根层叠上下文 天生就具有的 z-index...

2020-03-20 09:59:34

强类型转换

字符串与数字的隐式强类型转换ES5规范11.6.1节,如果某操作数是字符串或者能够通过以下步骤转换为字符串的话,+将进行拼接操作。如果其中一个操作数为对象(包括数组),则先调用ToPrimitive抽象操作,该操作在调用[[DefaultValue]],以数字作为上下文。ToPrimitive先调用valueOf(),再Tostring转换为字符串String()直接调用Tost...

2020-03-11 18:16:21

面向切面编程

面向切面编程也称AOP,主要作用是将与核心业务逻辑无关的功能抽离出来,以动态织入的方式掺入业务逻辑模块中。如日志记录功能等。可以保持业务逻辑的纯净,高内聚性;便于复用日志模块等装饰器模式给对象动态添加职责(即用即付)的方式为装饰器模式实现一个插件式的表单验证:校验+提交一般实现:function formSubmit(obj){ const {tel,name} = obj if...

2020-01-10 18:20:50

vue中编写通过方法调用的组件

通过函数调用的组件,常见的toast提示框,loading等创建文件目录结构|---loading |---Loading.vue |---index.js编写index.js思路创建组件构造器实例化组件挂载到一个新建的div上新增至body页面上通过实例对组件进行代理操作import Vue from 'vue'import LoadingComp...

2020-01-10 10:03:16

使用vue-cli3搭建typescript移动端

安装vuecli3npm install -g @vue/cli# ORyarn global add @vue/cli创建项目vue create project-typescript手动选择特性选择babel、ts、router、vuex、css预编译器这里我们使用基于类的组件选择sass编译器eslint规则独立的配置文件配置在App.vue中新增路...

2020-01-08 16:44:28

前端单元测试

文章目录测试类型unit测试E2E 测试单元测试原因vue项目中进行单元测试安装环境编写测试用例结论测试类型unit测试主要对组件进行测试。数据的有效性测试关注组件本身。vue 单元测试的范围仅限于数据流动是否正确,逻辑渲染是否正确(v-if v-show v-for),style 和 class 是否正确,我们并不需要关系这个组件在浏览器渲染中的位置,也不需要关系对其它组件会造成...

2019-10-16 17:42:05

js运行流程

js引擎处理js的过程同传统编译语言的代码编译大致相同文章目录流程预编译阶段声明提升let、const阻止提升的原因LHS与RHS查找类型流程步骤传统编译语言JS引擎1词法/语法分析词/语法分析2解析生成AST解析生成AST3代码生成预编译4执行执行预编译阶段js代码是运行时编译(编译发生在代码执行前几微秒),即预编译完立即...

2019-08-29 10:11:44

vue项目设置eslint规则校验

安装npm install --save-dev eslint eslint-plugin-vue配置"extends": ["plugin:vue/recommended"]解析器vscode安装eslint插件配置vscode自动fix设置保存时格式化"eslint.autoFixOnSave": true,扩展检查.vue文件关闭编辑器自动保存格式化,避免冲突...

2019-08-13 14:47:24

weex、ReactNative

weexWeex .we 文件 --------------前端(we源码)↓ (转换) -------------------前端(构建过程)JS Bundle -----------------前端(JS Bundle代码)↓ (部署) -------------------服务器在服务器上的JS bundle -------服务器↓ (编译) ------------------...

2019-08-13 11:17:27

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv1
    勤写标兵Lv1
    授予每个自然周发布1篇到3篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。