20180418 前端开发日报

你真的了解JS数组的那些方法吗？；ES6 javascript 实用开发技巧；webpack从此不再是我们的痛点 — 核心基础；简易实用的JavaScript日期时间操作；Angular DOM 更新机制；写一个简单vue 中间件，$emit、$on；Step-by-step，打造属于自己的vue ssr；前端性能优化之浏览器渲染优化 —— 打造60FPS页面

1. 你真的了解JS数组的那些方法吗？ 数组的创建有三种方式：构造函数方式、字面量方式、ES6新增的Array.of()方法创建。 构造函数方式： let arr = new Array(); // 创建一个空数组 let arr = new Array(10); // 创建长度为10的数组 let arr = new Array(‘a’); // 创建包含一个字符串元素a的数组 let arr = new Array(10, ‘a’); // 创建…
2. ES6 javascript 实用开发技巧 定义变量/常量 ES6 中新增加了 let 和 const 两个命令，let 用于定义变量，const 用于定义常量 两个命令与原有的 var 命令所不同的地方在于，let, const 都是块级作用域，其有效范围仅在代码块中，实例如下： //es5 if(1==1){ var b = ‘foo’; } console.log(b);//foo //es6 if(1==1){ let b = ‘foo’…
3. webpack从此不再是我们的痛点 — 核心基础 webpack一直是前端工程师的痛点，因为他的复杂、分散、loader、plugin这些第三方，让我们的学习成本陡然上升，使我们一直对他的配置模棱两可，今天带大家彻底明白他如何配置，摆脱困扰我们很久的痛点。本篇主要是webpack基础配置详解，关于webpack的模块chunk、编译阶段流程、输出阶段流程、loader的编写和手写plugin会…
4. 简易实用的JavaScript日期时间操作 在这里推荐一款简易实用的JavaScript日期时间处理工具： easedate.js 。 easedate.js 在原生Date对象的基础上，提供了日期输出的格式化，以及日期时间的加减计算、时差计算、条件判断、链式操作等功能，方便项目中的日期时间进行相关处理！ 欢迎访问 github.com/springlong/… 使用easydate N…
5. Angular DOM 更新机制 原文链接：The mechanics of DOM updates in Angular 由模型变化触发的 DOM 更新是所有前端框架的重要功能（注：即保持 model 和 view 的同步），当然 Angular 也不例外。定义一个如下模板表达式： &l
6. 写一个简单vue 中间件，$emit、$on 使用过vue的同学大多数都知道 on的使用。我们仅仅知道使用，有时候是完全不够的。现在我就带领大家写一个简单类似于vue空实例的中间件。 非父子组件的通信 非父子组件的通信vue官网给出这样的解决方案。 有时候，非父子关系的两个组件之间也需要通信。在简单的场景下，可以使用一个空的 Vue 实例作为事件总线： v…
7. Step-by-step，打造属于自己的vue ssr 笔者最近在和小伙伴对vue项目进行ssr的升级，本文笔者将根据一个简单拿vue cli构建的客户端渲染的demo一步一步的教大家打造自己的ssr，拙见勿喷哈。 what ？ why ？ What ？ 在学习一项新技术的时候我们首先要了解一下他是什么。这里引用官网的一句话: Vue.js 是构建客户端应用程序的框架。默认情况下，可以在浏…
8. 前端性能优化之浏览器渲染优化 —— 打造60FPS页面 前言 本文整理自：developers.google.cn 及 高性能JavaScript，再加上了一些个人对其中提到的知识点的理解与补充。前端性能优化涉及很多方面，本文仅针对高性能渲染进行分析。 单个帧的渲染流程 —— 像素管道 目前，大多数设备的刷新率都是
9. 七行JSON代码将你的网站变成移动应用 本文介绍了借助 Jasonette 将 Web 视图和原生组件融合构建真正“混合”应用的做法。 如果我告诉你，只需要 上述 7 行橙色的 JSON 代码 就可以将一个网站变成移动应用，你相信吗？完全不需要使用某种框架 API 重写网站，就可以获得与移动应用相
10. Vue.js可复用性 & 组合 在实际的应用中，有很多的业务代码是可以重复使用的，vue.js本身是一个注重于高效率的框架，所以也提供了组件中的复用功能。混入 (mixins) 是一种分发 Vue组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。如下： // 定义一个混…
11. Kafka 源码解析之 Server 端如何处理 Fetch 请求（十三） 上一篇讲述完 Kafka 如何处理 Produce 请求以及日志写操作之后，这篇文章开始讲述 Kafka 如何处理 Fetch 请求以及日志读操作。日志的读写操作是 Kafka 存储层最重要的内容，本文会以 Server 端处理 Fetch 请求的过程为入口，一步步深入到底层的 Log 实例部分。与 Produce 请求不一样的地方是，对于 Fetch 请求，是…
12. 你应该知道的前端–存储 1. cookie 可以笼统的将cookie分为两类: 会话cookie和持久cookie。会话cookie是一种临时cookie。用户退出浏览器时,会话cookie就被删除了。持久cookie的生存时间更长一些,他们存储在硬盘上,浏览器退出时他们仍然存在。
13. vue实践之vuex vue实践05之vuex getter方法 有时候我们需要从 store 中的 state 中派生出一些状态，例如对列表进行过滤并计数： computed: { doneTodosCount () { return this.$store.stat
14. Angular 属性绑定更新机制 原文链接：The mechanics of property bindings update in Angular 所有现代前端框架都是用组件来合成 UI，这样很自然就会产生父子组件层级，这就需要框架提供父子组件通信的机制。同样，Angular 也提供了两
15. webassembly 在 flv 编解码中的实战 pc端直播平台的播放器大部分已FLV 直播流格式为主。FLV 直播流可以嵌套在swf文件当中，可以用flash播放。 前几个月，我们刚刚完成了对直播播放器的重构，引入了现有的bilibili开源的flv.js，接入了flv h5播放器。向下兼容了flash播放器。 h5播放器的原理 各大直播平台纷纷介入h5播放器，增强…
16. 组件复用那些事儿 – React 实现按需加载轮子 组件化在当今前端开发领域中是一个非常重要的概念。著名的前端类库，比如 React、Vue 等对此概念都倍加推崇。确实，组件化复用性（reusability）和模块性（modularization）的优点对于复杂场景需求具有先天优势。组件就如同乐高积木、建筑石块
17. 小哥哥,小姐姐,我有一份tcp、http面试指南你要吗？ 来来来 对，我就是骗你进来的。嘿嘿嘿… 既然来了就看看再走嘛 作为一个学通信出身的前端，说道http、tcp什么的，算是到了我的领域了。（我会告诉你我上课净睡觉了，啥也没学到吗？）这次给大家讲讲http，提高水平、丰富知识。（要不是为了面试，谁会管什么tt
18. JavaScript 如何工作：渲染引擎和性能优化技巧 原文地址：How JavaScript works: the rendering engine and tips to optimize its performance 原文作者：Alexander Zlatkov 译文出自：掘金翻译计划 本文永久链接：git
19. Spring Boot 2.0 WebFlux 上手系列课程：快速入门（一） Spring Boot 2.0 spring.io 官网有句醒目的话是： BUILD ANYTHING WITH SPRING BOOT Spring Boot （Boot 顾名思义，是引导的意思）框架是用于简化 Spring 应用从搭建到开发的过程。应用开箱即用，只要通过一个指令，包括命令行 java -jar 、SpringApplication 应用启动类 、 Spring Boot Maven 插件等，就…
20. react-native-whc-calendar跨平台个性化日历组件 A react native module to show calendar, it works on iOS and Android.
21. 基于vue的在线聊天软件 基于浏览器端的web实时聊天工具，后台用的java Document 中文 English 功能列表 1.登录注册 2.添加好友&删除好友
22. 从零开始写一个 Promise 库 原文：Write Your Own Node.js Promise Library from Scratch 作者：code_barbarian Promise 已经是 JavaScript 中异步处理的基石，回调的场景将会越来越少，而且现在可以直接在 Node.js 使用 async/await。async/await 基于 Promise，因此需要了解 Promise 来掌握 async/await。这篇文章，将介绍如何编写…
23. 使用node爬虫做了一个vue小项目记录使用笔记 vue-backend-system github地址 一直想把以前所学的相关知识进行总结归纳，方便以后查看复习，正好最近最近抽时间研究点东西，打算是做前后台的，对后台这块不熟悉，本来是打算用node加mongodb实现，数据自己弄的不是很清楚，就干脆爬下自
24. Redux入门 — 买水果生鲜 在上一篇文章中，我们用 redux 帮水果店完善了买卖水果的流程。 Redux入门 — 买水果 谁知道水果店生意越来越好，于是开始拓展业务，不仅卖水果，还卖起了生鲜，于是有了水果部和生鲜部。所以我们要拓展下原来的代码了。 现在要增加一个生鲜的记账本 cons
25. 前端基于gulp后端基于freemarker的工作流程总结 前言最近在做一个PC端的项目，由于项目需要兼容到IE8，所以从技术选型上采取了公司之前一直沿用的前端基于gulp后端基于freemarker的模式来进行开发。那么gulp+freemarker这种开发模式的流程到底是怎样的呢？我这边就来简单的分析一下。一、前端
26. Redux源码学习（一）：createStore 前言 最近来到了新公司，应leader要求首先学习了redux。大佬们都说redux的实现很简单巧妙，那么就好好学习以下。本文将学习 createStore，并实现一个简单的 createStore。 createStore 接下来就按
27. JavaScript之浅复制【拷贝】与深复制【拷贝】【二】 下面了解下什么浅复制【拷贝】和深复制【拷贝】，通过下面的阅读你将了解到： 1、什么是浅复制以及使用场景 2、什么是深复制以及使用场景 3、浅复制和深复制有哪些方式 一、我们先来了解下，JavaScript基本知识，基本类型和引用类型 基本类型：number、s
28. vue中需要注意的问题总结(上) 文章首发于个人博客 前言 使用vue的时候经常会遇到一些问题,其实仔细阅读查阅官方文档,就会发现文档中已提到一些格外需要注意的点; 为了深入的理解官方文档中对这些问题的解释,查阅了一些资料,再加上自己的理解,整理了一些常见的问题;如果哪方面解释的不太合理希望
29. Swoole+React 实现的聊天室 前后端分离的项目，使用Swoole+React实现的聊天室，整个项目的框架结构可以进行参考，前端react+react-redux+react-router+react-ant等等，后台使用easySwoole，自行实现中间件（数据封装，token验证，签名验
30. 通过阅读 Douglas Crockford 的源码学习如何写 JSON parser（一） JSON-js Douglas Crockford 是 JSON 的发明者，所以通过 DC 的代码来学习 JSON 和 parser 绝对是上乘之选。这个仓库里面有四个 JS 文件，今天我们先研究 json_parse.js。 json_parse 定义了如下

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

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