uniapp上使用document方案之renderjs 使用uniapp做app时候，无法使用document，根据uniapp官方文档，可以引入renderjs是一个运行在视图层的js。它只支持app-vue和web。renderjs。
传统mvc项目，前后端不分离项目让静态资源走cdn 静态资源走cdn，能提升网站的响应速度，节约资源。在现在纯前端项目上，可以让整个项目静态资源走cdn，nginx代理跟后端交互，那前后端未分离的项目，怎么让静态资源走cdn呢？先说下springboot+thymeleaf的项目，springboot框架自带VersionResourceResolver类，该类是处理静态资源版本控制的一个类，主要用于实现资源缓存 busting。
js垃圾回收机制 js的垃圾收集JavaScript具有自动垃圾收集机制，也就是说，执行环境会负责管理代码执行过程中使用的内存。而在C和C++之类的语言中，开发人员的一项基本任务就是手工跟踪内存的使用情况，这是造成许多问题的一个根源。在编写JavaScript程序时，开发人员不用再关心内存使用问题，所需内存的分配以及无用内存的回收完全实现了自动管理。这种垃圾收集机制的原理其实很简单：找出那些不再继续使用的变量，然后释放其占用的内存。为此，垃圾收集器会按照固定的时间间隔（或代码执行中预定的收集时间），周期性地执行这一操作。
js的事件循环（event loop ），宏任务和微任务 setTimeout(function() { // 异步宏任务 console.log('1');})new Promise(function(resolve) { // 同步 console.log('2');}).then(function() { // 微任务 console.log('3');})// 同步console.log('4');//打印顺序 2 4 3 1直接上代码。宏任务：script全部代码、setTim.
mockjs在vue项目中的使用，不影响测试环境和生产环境 mockjs在项目中的使用现状：后台管理系统中，前后端进度可能会出现不一致的情况，前端的许多开发需要依赖后端接口开发的完成，这样就会造成前端的被动状态，会造成迭代前期前端时间充裕，迭代后期前端时间比较紧张（联调时间基本都在前端）目的：让迭代更顺畅，解决前后端进度不一致的情况，解决前端必须依赖后台接口的完成才去开发的现状。不影响现有代码具体实现：为什么使用mockjs也许想通过json文件去模拟后台接口的数据，但是获取到的数据是固定的，而且很局限，增删改的接口怎么去实现？Mock
浏览器缓存之http缓存和service worker 一、什么是浏览器缓存以往谈起性能优化，大部分时候都是从后端聊起，数据库的设计，缓存的使用等。其实前端在性能优化方面可做的也很多，如：减少http请求数、使用cdn、压缩合并css/js等，浏览器缓存就是把已经请求过的Web资源进行存储，当用户刷新页面或者下次访问时候，浏览器根据缓存机制决定是否需要向服务端发起请求。 所以缓存可以带来：减少网络带宽消耗、降低服务器压力、减少网络延迟，加快页面打开速度等优点二、浏览器缓存有哪些1、http缓存是基于HTTP协议的浏览器文件级缓存机制。2、w...
long.js的使用 如果是node启动的项目 直接npm install long安装就可。若传统项目，则把webpack打包之后的long.js引入到页面直接使用。下面是对long的or运算和and运算又封装的方法//long类型或运算function longOr(arr) { var arrLen = arr.length; if (arrLen < 1) { ...
webpack小记 1、webpack是什么？Webpack 是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源webpack的安装2、首先要确保安装了node其次可以全局安装，可以项目中安装npm install webpack (--g)3、webpack使用（1）执行命令 webpack main.js bundle.js...
vue-cli解析 上次给大家分享的是用vue-cli快速搭建vue项目，虽然很省时间和精力，但想要真正搞明白，我们还需要对其原理一探究竟。大家拿到一个项目，要快速上手，正确的思路是这样的：首先，如果在项目有readme.md的情况下，大家要先读readme，项目的一些基本介绍，包括项目信息、运行的脚本、采用何种框架，以及项目维护者等信息通常都会有。一般在git上维护的项目都会有readme.md，不熟悉mark...
js桥接模式 桥接模式：在系统沿着多个维度变化的同时，又不增加复杂度并已达到解耦。比如：鼠标移上去事件，改变背景和颜色function g(tag){ return document.getElementByTagName(tag);}var spans=g('span');spans[0].onmouseover=function(){ this.style.color='re...
js装饰者模式 装饰者模式：在不改变原对象的基础上，通过对其进行包装扩展（添加属性或者方法）使原有对象可以满足用户的更复杂需求。var decorator = function(input,fn){ //获取事件源 var input = document.getElementById(input); //若事件源已经绑定事件 if(typeof input.onclick === 'functio...
js装饰者模式 装饰者模式：在不改变原对象的基础上，通过对其进行包装扩展（添加属性或者方法）使原有对象可以满足用户的更复杂需求。var decorator = function(input,fn){ //获取事件源 var input = document.getElementById(input); //若事件源已经绑定事件 if(typeof input.onclick === 'functio...
js设计模式 套餐服务——外观模式 外观模式：为一组复杂的子系统接口提供一个更高级的统一接口，通过这个接口使得对子系统接口的访问更容易。在js中有时也会用于对底层结构兼容性做统一封装来简化用户使用。兼容模式<a id="myinput">click</a><script>function addEvent(dom, type, fn) { // 对于支持DOM2级事件处理程序...
js设计模式单例模式 单例模式：又称单体模式，是只允许实例化一次的对象类。有时也用一个对象来规划一个命名空间，井井有条地管理对象上的属性和方法 。命名空间的管理员防止变量或方法重复var ming={ g:function(id){ return document.getElementById(id); }, css:function(id,key,value){...
js设计模式语言之魂——原型模式 原型模式：用原型实例指向创建对象的类，使用于创建新的对象的类共享原型对象的属性以及方法。基于原型链实现对象之间的继承，这种继承是基于一种对方法或属性的共享，而不是对方法和属性的复制。原型模式就是将可复用的、可共享的、耗时大的从基类中提出来然后放在其原型中，然后子类通过组合继承或者寄生组合式继承而将方法和属性继承下来，对于子类中那些需要重写的方法进行重写，这样子类创建的对象既具有子类的属性和...
js设计模式分既是合——建造者模式 建造者模式：将一个复杂对象的构建层与其表示层相互分离，同样的构建过程可采用不同的表示。工厂模式主要是为了创建对象实例或者类簇，关心的是最终产出的是什么。不关心你创建的整个过程，仅仅需要知道最终创建的结果。所以通过工厂模式我们得到的都是对象实例或者类簇。然而建造者模式在创建对象是更为复杂一些，虽然其目的也是为了创建对象，但他更多关心的是创建这个对象的整个过程，甚至于创建对象的每一个细节。比...
js设计模式分既是合——建造者模式 建造者模式：将一个复杂对象的构建层与其表示层相互分离，同样的构建过程可采用不同的表示。工厂模式主要是为了创建对象实例或者类簇，关心的是最终产出的是什么。不关心你创建的整个过程，仅仅需要知道最终创建的结果。所以通过工厂模式我们得到的都是对象实例或者类簇。然而建造者模式在创建对象是更为复杂一些，虽然其目的也是为了创建对象，但他更多关心的是创建这个对象的整个过程，甚至于创建对象的每一个细节。比...
关注
