20180412 前端开发日报

前端3大JS框架走势图:Vue增长最快,react或被Preact 取代;区块链是如何工作的:用 JavaScript 演示;仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习;[基础向]Vue主要原理最简实现与逻辑梳理;JavaScript正则表达式学习笔记(二) – 打怪升级;vue.js源码- 剖析observer,dep,watch如何具体的实现数据双向绑定;澄清server push/websocket/sse的一些概念;js 深浅拷贝知多少

  1. 前端3大JS框架走势图:vue增长最快,react或被Preact 取代 Javascriptreport 近日发布了一篇文章来比较流行前端框架的走势。走势图是通过统计最新的数据,并与前一年的数据进行比较而生成。数据来源于 npm trends 的每日下载量。 前端框架三巨头 React、Angular 和 Vue,虽然都很受欢迎,
  2. 区块链是如何工作的:用 JavaScript 演示 原文:How does blockchain really work? I built an app to show you. 作者:Sean Han 译者:JeLewine 根据维基百科,区块链是: 一个用于维护不断增长的记录列表的分布式数据库,我们称之为区块链。 这听起来很棒,那它是如何工作的呢? 为了说明区块链,我们将会...
  3. 仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习 2019届大三学生,前段时间一直想一个人单独开发一个较为完整的项目,在众多应用中,考虑之后选择了美团外卖来模仿,这段时间就利用课余时间进行开发,前端用vue+vuex+vue-router+axios,因为需要用到定位和支付等功能,需要后端配合,而且想要做真正数据交互,所以用express(基于nodejs的框架)做后台,数据库用NOSQL的mo...
  4. [基础向]Vue主要原理最简实现与逻辑梳理 Vue的主要原理中主要用到了定义的这么几个函数Dep,Watcher,observer。 我们来使用这几个函数简单的实现一下vue构造函数数据绑定和相互依赖部分,梳理一下它们之间的关系。 省略了编译部分和proxy代理与其他的一些复杂逻辑。 Dep Dep是依赖类,简要实现为 class Dep { constructor () { // 放当时属性的观...
  5. JavaScript正则表达式学习笔记(二) - 打怪升级 本文接上篇,基础部分相对薄弱的同学请移步 《JavaScript正则表达式学习笔记(一) - 理论基础》 。上文介绍了 8 种JavaScript正则表达式的属性,本文还会追加介绍几种JavaScript正则表达式的属性(注意是非标准属性,但很好用)。 一. 上文回顾 本文会用到上篇文章部分内容,所以简单回顾下。 1.1 JavaScript正则表...
  6. vue.js源码- 剖析observer,dep,watch如何具体的实现数据双向绑定 Vue双向数据绑定的核心和基础api是Object.defineProperty,其内部真正参与数据双向绑定流程的主要有Obderver、Dep和Watcher,基于defineProperty和发布者订阅者模式,最终实现数据的双向绑定。那么Obderver、Dep和Watcher是如何具体配合工作的呢?下面就来理一理。 看此文章之前你需要对vue的双向数据绑定有一定的理解...
  7. 澄清server push/websocket/sse的一些概念 server push:有两个版本,http1的server push和http2的server push。 http1的server push:需要服务端代码,浏览器共同支持,简单说在浏览器发起请求后,服务端响应一个" Content-type: multipart/x-mixed-replace;boundary=-- boundaryString -- "的文档类型,然后由服务端代码循环推送内容...
  8. js 深浅拷贝知多少 最近在 vue 框架下写业务代码,不可避免地涉及到对象深浅拷贝的问题,趁机会总结记录一下。 由于微信文章平台只能再重新编辑一次,以后文章有更新的话,会更新到我自己的个人博客,有兴趣的可以围观下: 个人博客地址:blog.ironmaxi.com 内存的堆区与栈
  9. js原型链新理解 // 对象都是由函数创建的 //var obj = { a: 10, b: 20 }; //var arr = ; var obj = new Object(); obj.a = 10; obj.b = 20; var arr = new Array(); arr = 5; arr = 'x'; arr = true; 函数也是一种对象 他也是属性的集合,你也可以对函数进行自定义属性。 ...
  10. websocketj--随时随地在web浏览器中操作你的服务端程序
  11. EventEmitter:从命令式 JavaScript class 到声明函数式的华丽转身 新书终于截稿,今天稍有空闲,为大家奉献一篇关于 JavaScript 语言风格的文章,主角是函数声明式开发。 我们对一个简易的,面向对象的 EventEmitter 系统,一步步改造为函数式风格。并结合实例来说明函数式的优秀特性。 灵活的 JavaScript
  12. ES6解决了什么问题 ECMAScript 6.0于2015 年 6 月正式发布了,成为JavaScript 语言的下一代标准。ES6增加的语言特性解决了哪些问题,会给开发者哪些便利,是本文主要探讨的问题。 增加了对unicode字符的支持 ES5对字符的处理有限,无法很好地处理码
  13. 面试题:你能写一个Vue的双向数据绑定吗? 在目前的前端面试中,vue的双向数据绑定已经成为了一个非常容易考到的点,即时不能当场写出来,至少也要能说出原理。本篇文章中我将会仿照vue写一个双向数据绑定的实例,名字就叫myVue吧。结合注释,希望能让大家有所收获。 1、原理 Vue的双向数据绑定的原理相
  14. 2018年3月份GitHub上热门的Python项目】本篇文章为大家盘点了3月份最热门的Python 项目,让我们一起来看下吧!详见 ​​​

    2018年3月份GitHub上热门的Python项目
  15. 关于ES6的Promise JavaScript的异步处理 提到JavaScript的异步处理,也许很多人和我一样想到利用回调函数。 例如: firstAsync(function(data){ //处理得到的 data 数据 //.... secondAsync
  16. JavaScript 定时器知多少 深剖定时器 定时器类型 setTimeout: 指定xx时间后执行回调 setInterval: 指定每隔xx时间后定期执行 setImmediate: 和setTimeout(fn, 0)类似, 执行setTimeout(fn, 0)和setImmediate的顺序问题, 不同环境有差异 requestAnimationFrame: 跟着屏幕刷新而执行回调, 一般60HZ对应...
  17. laravel + webpack + vue脚手架 考虑 - 决定脚手架依赖 这次的项目是一个管理后台,介于以下两点原因: 这个项目最终会交由后端同学维护,所以前端相关流程应该尽量简单且最好基于后端同学熟悉的框架 项目前端部分必须有较快的开发效率,不能沿用之前后端同学开发后台时的完全laravel、前后端完全耦合的方法(项目目录可能较为混乱、开发效...
  18. react-router 源代码学习笔记 前言 使用 react-router 也有一段时间了,现在基于官方文档以及源码做一下总结。 文章略长 ^_^ 如果有不正确的地方,请务必指正。 1. Router Router
  19. ECMAScript 2016, 2017, 和2018中新增功能及示例 以下是ECMAScript 2016, 2017, 和2018中新增功能的示例 原文链接 很难跟踪JavaScript(ECMAScript)中的新功能,更难找到有用的代码示例。 因此,在本文中,我将介绍在ES2
  20. 使用让 JavaScript 安全且并发的 Web Workers Web Workers 提供了一种在浏览器单线程执行外运行 JS 代码的方式。单线程处理了包括页面内容展示,通过键盘、鼠标点击和其他装置的用户交互,以及对于 ajax 请求响应的一些请求。 事件处理和 AJAX 请求是异步发生的,可以作为一种通用浏览器展示代码路径之外的运行代码的方式,但是它们仍然在这一单线程内运行,并且必...
  21. vue nextTick深入理解-vue性能优化、DOM更新时机、事件循环机制 一、定义[nextTick、事件循环] nextTick的由来: 由于VUE的数据驱动视图更新,是异步的,即修改数据的当下,视图不会立刻更新,而是等同一事件循环中的所有数据变化完成之后,再统一进行视图更新。 nextTick的触发时机:
  22. 基于 angular 实现的一个【组件懒加载功能】 基于 angular 实现的一个【组件懒加载功能】 我们常常会遇到这样一个问题,当我们使用一个第三方控件库的时候,我们只用到了其中 1 个或某几个组件,会连带一大堆无用的东西,造成体积臃肿不堪。又或者首页用到的组件较多,首页加载速度缓慢,这个时候,我们或许需
  23. [WebAssembly 入门] 与 Webpack 联动 title: 与 Webpack 联动 date: 2018-4-6 19:40:00 categories: WebAssembly, 笔记 tags: WebAssembly, JavaScript, Rust, LLV
  24. 浅析TCP和nodejs中TCP的简单应用 emmmmmmm... tcp 我们应该都知道,tcp是一种网络协议。 说起网络,在大学学计算机网络的时候,记得老师讲过网络一共分7层,这7层从上到下依次是物理层、数据链路层、网络层、传输层、会话层、表示层和应用层。 我们来看张图: OSI是Open Sys
  25. React Render Props 模式 概述 Render Props模式是一种非常灵活复用性非常高的模式,它可以把特定行为或功能封装成一个组件,提供给其他组件使用让其他组件拥有这样的能力,接下来我们一步一步来看React组件中如何实现这样的功能。 React 组件数据传递 React中我们可以给一
  26. webpack-loader详解 webpack-loader是什么? loader是一个函数,有一个参数是源文件内容,有内部的this,最后的loader必须有返回值否则会报错:Final loader didn't return a Buffer or String 原因: 如果是处理
  27. Webpack 源码解析 Webpack 作为前端领域最重要的构建工具,任何一个优秀的前端工程师必定需要对它有比较深入的了解。本系列文章会带您深入理解webpack的实现原理,阅读关键代码,并自己实现一些简单的功能。 这个系列总共包括8篇文章,首先分析我们常用的一些loader,然后看webpack核心代码的工作流程,最后探讨HMR以及tree-shaking...
  28. 深入研究CSS字体度量及CSS 盒子 这张图展示的是8种不同的字体,其中第一、第二个分别为 font-awesome图标、自定义的字体图标,其余字体依次为Avenir、Trebuchet MS、Arial、Helvetica、Hiragino Sans GB、STXihei。 源代
  29. JavaScript 单元测试框架:Jasmine, Mocha, AVA, Tape 和 Jest 的比较 原文地址:JavaScript unit testing frameworks: Comparing Jasmine, Mocha, AVA, Tape and Jest 原文作者:Ben Harding 译文出自:掘金翻译计划 本文永久链接:github.c

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多

原文:20180412 前端开发日报 ,未经许可,禁止转载。
来源:前端开发博客 (http://caibaojian.com/fe-daily-20180412.html)