20181226 前端开发日报-前端开发博客

2019年值得收藏的 15 个 JavaScript 和 CSS 动画库；Vue项目Webpack优化实践，构建效率提高50%；浅谈JavaScript的类型转换；Javascript高级面试；从 React 到 Domcom：一个提供 DOM 部件的 Web 框架；JS 总结之原型继承的几种方式；一览js模块化：从CommonJS到ES6；JS 总结之函数、作用域链

2019年值得收藏的 15 个 JavaScript 和 CSS 动画库当我浏览网页寻找一个整洁的 Javascript 动画库时，我发现很多 “推荐” 的动画库都有一段时间没维护了。经过一些研究，我收集了 15 个最好的 Javascript 动画库，你可以放心在你的应用程序中使用。在文章最后我还添加了一些有用的库，但是有一部分很久没维护了。使用纯CSS 在深入研究这些库之前，不要忘记使用纯 …
Vue项目Webpack优化实践，构建效率提高50% 公司的前端项目使用Vue框架，Vue框架使用Webpack进行构建，随着项目不断迭代，项目逐渐变得庞大，然而项目的构建速度随之变得缓慢，于是对Webpack构建进行优化变得刻不容缓。经过不断的摸索和实践，通过以下方法优化后，项目的构建速度提高了50%。现将相关优化方法进行总结分享。 1、缩小文件的搜索范围 1.1、优化Lo…
浅谈JavaScript的类型转换在 JavaScript 中，将一种值类型转换为另一种值类型，叫做类型转换，出于动态型语言的特性，类型转换发生在运行时阶段。这些转换在我们平时写的代码里无处不在，尽管我们没有注意，但是这些转换已经存在于我们的代码里了。像 if、for、while、==、===、+、- 等等语句中。而在 JavaScript 中，有两种转换风格：隐式强…
Javascript高级面试原型异步一、什么是单线程，和异步有什么关系单线程：只有一个线程，同一时间只能做一件事原因：避免DOM渲染的冲突解决方案：异步为什么js只有一个线程：避免DOM渲染冲突浏览器需要渲染DOM JS可以修改DOM结…
从 React 到 Domcom：一个提供 DOM 部件的 Web 框架从React到Domcom：一个提供DOM部件的web框架 github.com/taijiweb/domcom 设计背景 ReactJS给前端Web应用开发的思路带来巨大转变，颠覆了很多以前的观念。我有多次机会接触和学习ReactJS，在理解它先进的理念的同时也发现它存在一些问题，最初主要集中在性能方面，比如重复生成部件的虚拟do…
JS 总结之原型继承的几种方式在之前的总结中，我们详细分析了原型《JS 总结之原型》，原型很大作用用于模拟继承，这一次，我们来聊原型继承的几种方式。前提以一个父类为前提条件，列举 js 继承的继承方式： function Person (age) { this.age = age || 18 } Person.prototype.sleep = function () { console.log(‘sleeping’)…
一览js模块化：从CommonJS到ES6本文由云+社区发表模块化是指把一个复杂的系统分解到一个一个的模块。模块化开发的优点： (1)代码复用，让我们更方便地进行代码管理、同时也便于后面代码的修改和维护。 (2)一个单独的文件就是一个模块，是一个…
JS 总结之函数、作用域链 JavaScript 用 function 关键字来声明一个函数： function fn () { } 复制代码变体：函数表达式： var fn = function () { } 复制代码这种没有函数名的函数被称为匿名函数表达式。 ‍ return 函数可以有返回值 function fn () { return true } 复制代码位于 return 之后的任何代码都不会执行： …
【连载】前端个人文章整理-从基础到入门从最开始萌生写文章的想法，到着手开始写，再到现在已经一年的时间了，由于工作比较忙，更新缓慢，后面还是会继更新，现将已经写好的文章整理一个目录，方便更多的小伙伴去学习。
浅谈JavaScript正则表达式刚开始学习 JS 时，正则表达式一直是我不愿意面对的，每次读到有关正则表达式的时候，都会避而远之。可是，一次，当我打开 JQ 源码的时候，发现里面有大量的正则表达式。于是乎，自己就强迫自己学习正则，学习的过程还是蛮愉快的。最后，真香定律终于出现了。哈哈哈！！这篇教程我会由浅入深的来和大家分享正则表达式…
Vue 的打包优化之路场景分析一个结构简单，依赖蛮多的可视化项目，用到的库有 1. Vue + VueRouter + Vuex + axios 2. ECharts + 全省份地图文件 + 中国地图文件 3. ElementUI 4. moment (后面被 date-fns 代替) 5. lodash + lodash-decorator (用到了装饰器) ECharts 的 JSON 地图文件占了很大…
mpvue如何使用vuex 首先，问大家一个问题，vue是单页面应用，为什么vuex在小程序的多页面中也可以使用？答：虽然小程序是多页的，但小程序的多页主要是指视图层是多个 webview，相互独立，但是 js 都是在同一个执行环境中的，所以在 mpvue中可以直接使用vuex 来管理状态。解决了这个困惑之后，大家是不是还有一个疑问，mpvue中…
通过几个问题深入浅出Vue 通常，Vue给我们的印象是“小巧易用”，凭借其简洁明了的模板开发方式，以及强大的指令系统，我们可以轻轻松松几行代码搞定一个数据双向绑定的页面。但是，这背后Vue帮我们做了多少工作，我们是知之甚少的。 Vue就像一个黑盒子，我们输入一些数据，它给我们输出一个渲染好的页面。对于开发，这很方便，我们不需要关心何…
Airbnb 的 React Native 之路（上）作者 | 钱凯杏仁移动开发工程师，前嵌入式工程师，关注大前端技术新潮流。最近在前端圈大名鼎鼎的 Airbnb（爱彼迎）团队宣布放弃 React Native。他们在自己的博客的中写了一系列文章详细介绍了使用 React Native 的开发经历，解释了放弃使用 RN 的原因。本文就是对这些博文的整理和翻译。 …
《JS定时器，你所要了解的那点事》开发过程中我们常常要用到定时器去完成某些需求。JS为我们准备了两个函数：setTimeout和setInterval…… （by Gladyu）
浏览器是如何解析html的？当我们在浏览器地址栏输入一个合法的 url 时，浏览器首先进行 DNS 域名解析，拿到合适的服务器 ip 地址后，浏览器给服务器发送 GET 请求，等到服务器正常返回后浏览器开始下载并解析 html 。这里仅总结浏览器解析html的过程。 html 页面主要由 dom 、 css 、 javascript 等部分构成，其中 css 和 javascript 既能内…
【20181225 前端开发日报】Javascript中的复制粘贴功能；React研习之旅（一）：React基础与核心；JS 总结之原型继承方式收录；JS 总结之 class；用js实现快排；aotoo-hub：一体化的大前端架构方案…详情→
package.json的所有配置项及其用法，你都熟悉么在前端开发中，npm已经是必不可少的工具了。使用npm，不可避免的就要和package.json打交道。平时package.json用得挺多，但是没有认真看过官方文档。本文结合npm官方文档以及自己平时使用过程中的感悟，谈一谈pack…
vue响应式系统源码解析 vue和react是现在前端框架的双子星。vue以其简单好用而闻名。vue以数据驱动视图，数据响应系统是vue的核心。这篇文章主要是结合源码分析vue响应式系统的原理和实现。代理下面这段代码是vue使用的典型方式： <div id="app-5"> <p>{{ message }}</p> <button v-on:click=&quot…
掌握浏览器重绘(repaint)重排(reflow))-前端进阶很多人都知道要减少浏览器的重排和重绘，但对其中的具体原理以及如何具体操作并不是很了解，当突然提起这个话题的时候，还是会一脸懵逼。希望大家可以耐着性子阅读本文，仔细琢磨，彻底掌握这个知识点！
在Vue3.0之前，回顾Vue2.0新特性的使用一、深度作用选择器（ >>> ）严格来说，这个应该是vue-loader的功能。”vue-loader”: “^12.2.0” 在项目开发中，如果业务比较复杂，特别像中台或B端功能页面都不可避免的会用到第三方组件库，产品有时会想对这些组件进行一些UI方面的定制。如果这些组件采用的是有作用域的CSS，父组件想要定制第三方组件的样…
Snabbdom.js（一）闲聊：在学vue的过程中，虚拟dom应该是听的最多的概念之一，得知其是借鉴snabbdom.js进行开发，故习之。由于我工作处于IE8的环境，对ES6，TS这些知识的练习也只是浅尝辄止，而snabbdom.js从v.0.5.4这个版本后开始…