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

[NodeJs系列]理解NodeJs中的Event Loop、Timers以及process.nextTick()；让老板虎躯一震的前端技术，KPI杀手；WebSocket 协议 1~4 节；webpack4系列教程（九）：开发环境和生产环境；基于Vue的任务节点图绘制插件（vue-task-node）；Vue 实践小结；Vue 源码解析（实例化前） – 初始化全局API（二）；ReactPHP 爬虫实战：下载整个网站的图片

[NodeJs系列]理解NodeJs中的Event Loop、Timers以及process.nextTick()译者注：为什么要翻译？其实在翻译这篇文章前，笔者有Google了一下中文翻译，看的不是很明白，所以才有自己翻译的打算，当然能力有限，文中或有错漏，欢迎指正。文末会有几个小问题，大家不妨一起思考一下欢迎…
让老板虎躯一震的前端技术，KPI杀手随着近几年的前端技术的高速发展，越来越多的团队使用 React、Vue 等 SPA 框架作为其主要的技术栈。以 React 应用为例，从性能角度，其最重要的指标可能就是首屏渲染所花费的时间了。那么今天，我们要给大家分享…
WebSocket 协议 1~4 节此文仅作为RFC6455 的学习笔记。篇幅太长超过了简书的单篇最大长度，故分为两篇，此篇记录 1~4 节，其余见 WebSocket 协议 5~10 节 ; 1.1 背景知识由于历史原因，在创建一个具有双向通信机制的 web 应用程序时，需要利用到 HTTP 轮询的方式。围绕轮询产生了 “短轮询” 和 “长轮询”。短轮询浏览器赋予了…
webpack4系列教程（九）：开发环境和生产环境如果你一直跟随我前面的博文，那么你对webpack的基础知识已经有比较深刻的理解了。之前，我们一直执行着：
基于Vue的任务节点图绘制插件（vue-task-node）在线Demo [链接]vue-task-node 是一个基于Vue的任务节点图绘制插件（vue-task-node is a Vue based task node mapping plug-in）
Vue 实践小结记一次 Vue 复习实践小结，编码技术总得时不时拿出来实践一番，不然很多细节的东西就会随着时间流逝，并且通过每一次实践你总能发现一些自己之前没有注意到的知识点，加深自己对一门语言或者框架的理解。话不多说，让我们开始吧。理清 Vue 属性相关我一直分不清，Vue 对象的属性哪些是函数，哪些是对象，以至于…
Vue 源码解析（实例化前） – 初始化全局API（二）由于数据双向绑定的内容会比较多一些，而且涉及到的知识点也比较多，所以我当时就从初始化全局API里面单独拿了一章出来，去讲解 vue 到底是如何实现的数据双向绑定，现在，接着把之前没有讲完的初始化全局API要做的事情，全都给讲完。还是那句老话，如果觉得写的哪里不对了，还希望大家多多指出，欢迎评论；如果觉…
ReactPHP 爬虫实战：下载整个网站的图片你是否曾经需要从一个没有提供 API 的站点获取信息? 我们可以通过网页抓取，然后从目标网站的 HTML 中获得我们想要的信息，进而解决这个问题。当然，我们也可以手动提取这些信息, 但手动操作很乏味。所以, 通过…
Jest + Enzyme 前端自动化测试Jest 是 Facebook 发布的一个开源的、基于 Jasmine 框架的 JavaScript 单元测试工具。
讨论 JS ⚡：文档如果你曾经参与过开源项目，或大到需要文档的项目，那么你应该知道编写一个合格的文档是多么的重要。此外，文档需要始终保持最新，并且应包含所有公共 API。因此，如何制作**完美的文档呢？**本文的目标就是用 JS 的风格来解决这个问题！ :zap: Photo byrawpixel /Unsplash 而且只有两种方法。。。 …
从0到1使用VUE-CLI3开发实战（三）: ES6/ES7知识储备今天群里有小伙伴跟我聊天，问了我几个关于ES6的问题，我才意识到，大部分初学者在学习的过程中，都是学了HTML/CSS/JS之后就开始上手学习框架了，而对于ES6的重视程度却不是那么足，或是仅仅了解部分ES6的用法。…
VUE单页应用骨架屏方案简单的说，骨架屏就是在页面未渲染完成的时候，先用一些简单的图形大致勾勒出页面的基本轮廓，给用户造成页面正在加载的错觉，待页面渲染完成之后再用页面替换掉骨架屏，从而减少页面白屏的时间，给用户带来更好的体验。分析VUE渲染过程使用vue-cli3.0创建项目： vue create project …
从前端角度理解缓存前端发送请求主要经历以下三个过程，请求->处理->响应。如果有多次请求就需要重复执行这个过程。
vue项目接口管理在vue开发中，会涉及到很多接口的处理，当项目足够大时，就需要定义规范统一的接口，如何定义呢？方法可能不只一种，本文使用axios+async/await进行接口的统一管理本文使用vue-cli生成的项目举例
[实践系列]Promises/A+规范前言 [实践系列] 主要是让我们通过实践去加深对一些原理的理解。实践系列-前端路由实践系列-Babel原理有兴趣的同学可以关注实践系列。求star求follow~ 什么是Promise ? Promise是JS异步编程中的重要概念，…
JavaScript是如何工作的: CSS 和 JS 动画底层原理及如何优化它们的性能这是专门探索 JavaScript 及其所构建的组件的系列文章的第 13 篇。如果你错过了前面的章节，可以在这里找到它们： JavaScript 是如何工作的：引擎，运行时和调用堆栈的概述！ JavaScript 是如何工作的：深入V8引…
为 JavaScript 开发人员准备的 Dart 参考教程 Dart 是 Flutter 主要的开发语言，这一篇文章主要为 JavaScript 开发人员准备的 Dart 教程，我会用很详细的对比来参考，力争 JavaScript 开发人员可以快速的熟练使用 Dart，为使用 Flutter 做好准备；使用 es2015 做为参照；示例可以使用 https://dartpad.dartlang.org/ 来运行；Dart 和 JavaScript 有非…
WebSocket 协议 5~10 节在 WebSocket 协议中，数据的传输使用一连串的帧。为了使得中间件不至于混淆（比如代理服务器）以及为了第 10.3 节将讨论安全原因，客户端必须将要发送到服务端的帧进行掩码，掩码将在第 5.3 节详细讨论。（注意，不管 WebSocket 有没有运行在 TLS 之上，都必须有掩码操作）服务端一旦接收到没有进行掩码的帧的话，必须…
Flutter 状态管理之 Scoped Model & Redux 前言文章原文地址:Nealyang/PersonalBlog 可能作为一个前端，在学习 Flutter 的过程中，总感觉非常非常相似 React Native，甚至于，其中还是有state的概念setState，所以在 Flutter 中，也当然会存在非常多的解决方案，比如 redux 、RxDart 还有 Scoped Model等解决方案。今天，我们主要介绍下常用的两种 S…
eruda 的 webpack 插件，帮助调试移动端网页 English | 中文 eruda-webpack-plugin eruda 的 webpack 插件使用 npm i –save-dev eruda-webpack-plugin // webpack.config.js const ErudaWebapckPlugin = reuire(‘eruda-webpack-plugin’) const HtmlWebpackPlutin = require(‘html-webpack-plugin’) const config =…
【20190118 前端开发日报】JS 将有父子关系的平行数组转换成树形数据；携程机票 Node.js 开发实践；2019年山地人的前端完整自学计划——讲一个B站UP主山地人的40天前端自学故事；前端基本功-示例代码…详情→
模拟实现 JS 引擎：深入了解 JS机制以及 Microtask and Macrotask 如果 JavaScript是单线程的，那么我们如何像在Java中那样创建和运行线程？很简单，我们使用 events 或设定一段代码在给定时间执行，这种异步性在 JavaScript 中称为 event loop 。在这篇文章中，主要想分析两个点： Javascript 中的 event loop 系统是如何工作；实现自定义 Javascript 引擎来解释 e…
JS题目之数组数据拆分重组转成嵌套对象,让脑细胞活跃下下班的时候在群里看到一个小伙伴,在群里问了一道 js 的题,发现没人理会他; 来了兴趣就折腾了下,以下是解答过程,用的是 ES6+ 的特性,在 chrome跑的题目效果图解答尽量注释,我分步骤解答 1:数组变形格式:先拿到数据格式如下; , , [ …
[前端怪谈_1] 从 for of 聊到 Generator 说起 for of 相信每个写过 JavaScript 的人都用过 for of ，平时我们用它做什么呢？大多数情况应该就是遍历数组了，当然，更多时候，我们也会用 map() 或者 filer() 来遍历一个数组。但是就像我们标题里面说的，它跟 Generator 能扯上什么关系呢？首先我们想一个问题，为什么使用 for of 或者 map() / filer() 方…
浏览器端用JS实现创建和下载图片在前端很多的项目中，文件下载的需求很常见。尤其是通过JS生成文件内容，然后通过浏览器端执行下载的操作。如图片，Execl 等的导出功能。日前，项目中就遇到了这类需求，在浏览器端实现保存当前网页为图片，然后…
[前端怪谈_2]从 Dva 的 Effect 到 Generator + Promise 实现异步编程结合上一篇文章，我们来聊聊 Generator 基础原理 dva 中有一个 Effect 的概念，它就是使用 Generator 来解决异步请求的问题，我们也来聊一聊 Generator + Promise 如何异步编程：开始之前，我们需要了解一些基本的概念： Generator 作为ES6中使用协程的解决方案来处理异步编程的具体实现，它的特点是…