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

从头搭建一个 Vue.js 项目工程；如何搭建移动端CSS样式库；《JavaScript 正则表达式迷你书》问世了；前端代码规范及最佳实践 | Isobar；前端面试之webpack篇；React 探秘：React Component 和 Element；CSS 写作建议和性能优化小结；React 16 发布，Facebook 如约解除了专利条款

从头搭建一个 Vue.js 项目工程前言: 在很多人眼里能用 vue-cli 脚手架直接搭建 Vue.js 项目工程很爽，很方便，但是当遇到问题的时候我相信会有一堆人一脸茫然，有时候会不知所措。而我不喜欢用别人准备好的架子，无论做什么项目必须从0到1的搭建起来，每次构建项目体系的时候如同搭积木一般，每次积攒不同的技术实战经验。我一直认为:“只有自己亲身…
如何搭建移动端CSS样式库前言在搭建公司的样式库时自己的一点整理，中间遇到了很多疑惑，也解决了很多疑惑。目前样式库和文档还在继续开发编写中，希望该文章对存在疑惑的朋友有帮助，也希望有经验的大牛们能提供更多思路上的帮助。为什么需要搭建自己的样式库现在这么多优秀的开源组件库,为什么还
《JavaScript 正则表达式迷你书》问世了下载链接：pan.baidu.com/s/1hr6wovU之前在本站发表了一篇文章，《JS正则表达式完整教程（略长）》，正如你所看到的那样确实很长，也获得了近1000人的喜欢。但文章太长，想必有很多同学看不下去，大都只是收藏罢了。因此我整理成一本pdf。既然只
前端代码规范及最佳实践 | Isobar 前端代码规范及最佳实践概述本文档包含了Isobar公司的创意技术部（前端工程）开发web应用的规范。现在我们把它开放给任何希望了解我们迭代过程最佳实践的人。编写本文档的主要驱动力是两方面： 1) 代码一致性以及 2) 最佳实
前端面试之webpack篇还是以前一样，有些概念面试可能会考，我都用*标记了出来，两句话就总结清楚其余的地方如果你想了解webpack，就仔细看看，虽然本教程不能让你webpack玩的很6，但是懂操作流程够了。面试你一般问你webpack的原理，Loader的原理，你有用那些优化措施前端开发已经模块化，它改进了代码库的封装和结构。打包工具已经成为…
React 探秘：React Component 和 Element 前天回答了这么一个问题，为什么inferno.js这么快？https://www.zhihu.com/question/65824137/answer/235159117 关注并询问的同学挺多，打算写几篇系列文章进行讲解。今天这篇文章比较偏基础，但是对入门 React 内部机制和实现原理却至关重要。算是为以后深入解读的一个入门，如果您已经非常清楚: React Compon…
CSS 写作建议和性能优化小结 1.前言还有几天就到国庆中秋了，快要放假了，先祝大家节日快乐！之前写过js的写作建议和技巧，那么今天就来聊聊css吧！说到css，每一个网页都离不开css，但是对于css，很多开发者的想法就是，css只要能用来布局，把效果图排出来就可以了，其它的细节或者优化，
React 16 发布，Facebook 如约解除了专利条款 | 26 日，Facebook 发布了 React 16，并如之前承诺的，将 React 16 JavaScript 库以及 GraphQ … （
React-Redux 分析 Redux，作为大型React应用状态管理最常用的工具，其概念理论和实践都是很值得我们学习，分析然后在实践中深入了解的，对前端开发者能力成长很有帮助。本篇计划结合Redux容器组件和展示型组件的区别对比以及Redux与React应用最常见的连接库，react-redux源码分析，以期达到对Redux和React应用的更深层次理解。前言…
一份来自Treebo 的 React 与 Preact PWA 性能分析报告作者：来自Treebo的Lakshya Ranganath，和来自Chrome的Addy Osmani Treebo是一家印度家喻户晓的经济型连锁酒店，在旅游业中占据了价值200亿美元的市场。他们最近开发了一个新的渐进式应用(PWA)作为默认
#CSS3#【Respond.js让IE6-8支持CSS3 Media Query】Bootstrap里面就引入了这个js文件，从名字看出来是自适应的兼容。打开IE看了一下，效果挺好的，自适应的效果挺好的。Respond.js让不支持CSS3 Media Query的浏览器包括IE…请戳→ #前端开发博客#
Preact 源码解析之 setState 相关流程 Preact 源码解析之 setState 相关流程 Preact 作为实现大部分 React 的接口，并且专注于轻量的框架，在前一阵 React 由于专利事件受到质疑的时候，进入了大家的视野，并且成为了在不得已需要放弃 React 之后的首选。虽然在
深入 Vue2.x 的虚拟 DOM diff 原理一、前言 Vue的核心是双向绑定和虚拟DOM（下文我们简称为vdom），关于双向绑定可以参阅木琴的文章《剖析Vue原理&实现双向绑定MVVM 》，vdom是树状结构，其节点为vnode，vnode和浏览器DOM中的Node一一对应，通过vnode的elm属性可以访问到对应的Node。 vdom因为是纯粹的JS对象，所以操作它会很高效，但是vdom的…
前端的基礎修養：ARIA Live Regions 「前端的基礎修養」這一系列時隔已久，原本打算持續更新的，中間竟斷了兩年，現在又撿起來，亦不知能否堅持下來。所以喚作「修養」，大抵因為心虛，覺得沒有什麼技術含量，不便言之技術。這一篇還是談 Accessibility，未來亦有相當一部分這一主題的文章。
WordPress 核心 JavaScript 框架选择讨论话题持续进行 WordPress中文网 30分钟前 / 5 次阅读 WordPress 核心 JavaScript 框架选择讨论话题持续进行昨天，WordPress #core-js Slack 频道进行了一场活跃的技术讨论会议，讨论的重点不再是具体框架之间的比较；而是在未来 WordPress 的基于 Javascript 的界面构建中，框架所能扮演的角色，发挥的作用。…
性能优化之 DNS Prefetch 一个网络请求的生命周期，需要经过这么几个步骤：DNS 查询、建立 TCP 连接、数据传输、断开连接。 DNS 查询就是将域名转换成 IP 的过程，这个过程短的话 2ms 几乎无感，长则可能达到几秒钟。DNS Prefetch 的原理就是在 HTTP 建立之前，将 DNS 查询的结果缓存到系统/浏览器中，提升网页的加载效率。现代浏览…
基于casperjs、resemble.js实现一个像素对比服务本次分享一个提供设计稿与前端页面进行一个像素对比的node服务，旨在为测试或者前端人员自己完成一个辅助性测试。
使用Vue.js创建自定义输入框原文： https://www.smashingmagazine.com/2017/08/creating-custom-inputs-vue-js/ 基于组件的库或者框架（例如 Vue）给我们在开发可复用的组件带来了极大的方便。这些组件可以非常简单的在独立的应用程序中被使用，并且最终呈现的效果一致。比如，在表单输入的场景，在功能上往往会比较复杂，通常…
NodeJs 版本8.5 体验experimental-modules 最近NodeJs 版本 8.5 已经支持了 ESM module，感觉之前的babel编译可以放弃不用了，不过这个只是一个实验性的，具体稳定与否，是否可以上生产环境，还是需要测试一段时间的。体验环境搭建： NodeJs: v8.5.0 依赖包： "dependencies": { "axios": "^0.16.2", "k…
Node.js 性能调优之调试篇(四)——supervisor-hot-reload
React 的性能优化（一）当 PureComponent 遇上 ImmutableJS 一、痛点在我们的印象中， React 好像就意味着组件化、高性能，我们永远只需要关心数据整体，两次数据之间的 UI 如何变化，则完全交给 React Virtual Dom 的 Diff 算法去做。以至于我们很随意的去操纵数据，基本优化 shouldComponentUpdate 也懒得去写，毕竟不写也能正确渲染。但随着应用体积越来越大，会发现页面…