20180323 前端开发日报

还在用 JSON?Google Protocol Buffers 更快更小(原理篇);潜入理解ES6-Promise用法小结;十倍效能提升:Web 基础研发体系的建立;【前端面试分享】2018春招实习生前端面试经验;Nerv – 京东高性能前端框架;为什么我要再为Angular发明一个状态管理框架?;vue正式环境与测试环境压包配置方法;你应该要知道的Vue.js

  1. 还在用 JSON?Google Protocol Buffers 更快更小(原理篇) 背景 随手记客户端与服务端交互的过程中,对部分数据的传输大小和效率有较高的要求,普通的数据格式如 JSON 或者 XML 已经不能满足,因此决定采用 Google 推出的 Protocol Buffers 以达到数据高效传输。 介绍 Protocol buffers (https://developers.google.com/protocol-buffers/)为 Goog…
  2. 潜入理解ES6-Promise用法小结 挂起 已成功 已完成 其中后两种都是异步操作完成后的状态 Promise做保证 Promise 对象用于表示一个异步操作的最终状态(完成或失败),以及其返回的值。 MDN对Promise的定义如上,可以理解为此对象做了一些保证,告知我们异步操作的状态。具体如下: 当前事件队列执行完成之后,再…
  3. 十倍效能提升:Web 基础研发体系的建立 1 导读 web 基础研发体系指的是, web 研发中一线工程师所直接操作的技术、工具,以及所属组织架构的总和。在过去提升企业研发效能的讨论中,围绕的主题基本都是——”通过云计算、云存储等方式将底层核心技术封装成基础设施“。而我们在实践中发现,在 互联网渗入到各行各业,业务爆发 …
  4. 【前端面试分享】2018春招实习生前端面试经验 经过二十多天的面试,面了九家公司,十几次面试,前一段时间几乎每天都有,最多一天面了三次……终于算是告一段落了,拿到了深信服和网易游戏的offer,因为每次面试完我都认真总结了相关问题,所以这次把我遇到的面试问题汇总一下发出来,我希望大家可以看出一些高频考点,不
  5. Nerv – 京东高性能前端框架 Nerv 是一款由京东凹凸实验室打造的类 React 前端框架。目前已广泛运用在京东商城(JD.COM)核心业务及TOPLIFE全站。Nerv 基于React标准,使用 Virtual Dom 技术,拥有和 React 一致的 API 与生命周期,如果你已经对
  6. vue正式环境与测试环境压包配置方法 这里分别添加env_config=prod,env_config=dev来控制当前的压包环境 package.json "scripts": { – "build": "node build/build.js", + "build:prod": "cross-env env_config=prod node build/build.js", + "build:dev": "cross-env env_config…
  7. 你应该要知道的Vue.js 原文:你应该要知道的Vue.js 组件data为什么必须是函数? 因为组件可能被多处使用,但他们的data是私有的,所以每个组件都要return一个新的data对象 组件通信 父子组件通信:$on、$emit 非父子组件的通信: event bus 复杂情况
  8. JavaScript变量提升的本质 变量提升 先说三句总结性的话: let 的「创建」过程被提升了,但是初始化没有提升。 var 的「创建」和「初始化」都被提升了。 function 的「创建」「初始化」和「赋值」都被提升了。 所以,我们要注意,这三种变量提升,含义是不同的。 变量提升的规律 在进入一个执行上下文后,先把 var 和 func…
  9. Vue——(7)组件——slot内容分发 ①概述: 简单来说,假如父组件需要在子组件内放一些DOM,那么这些DOM是显示、不显示、在哪个地方显示、如何显示,就是slot分发负责的活。 ②默认情况下 父组件在子组件内套的内容,是不显示的。 例如代码: <div id="app"> <children> <span>12345</span> …
  10. CSS3布局神器 – Flexbox display:flex是CSS3的新特性,是一个强大的布局神器。 在传统的布局中,通常使用浮动float、position,虽然能很好进行布局,但自从接触flex后,对前端的布局来说简直就是一种解放。 上图为 flex在各浏览器和设备上的兼容性问题,可见除了
  11. 控制流程完整性:给大家介绍一种“另类”的Javascript反分析技术 写在前面的话 理解恶意软件的真实代码对恶意软件分析人员来说是非常有优势的,因为这样才能够真正了解恶意软件所要做的事情。但不幸的是,我们并不总是能够得到“真实”的代码,有时恶意软件分析人员可能需要类似反汇编工具或调试器之类的东西才能“推测”出恶意软件的真实行为。不过,当恶意软件使用的是“解释型语言”开发…
  12. Vue封装一个简单轻量的上传文件组件 项目中多出有上传文件的需求,使用现有的UI框架实现的过程中,不知道什么原因,总会有一些莫名其妙的bug。比如用某上传组件,明明注明(:multiple="false"),可实际上还是能多选,上传的时候依然发送了多个文件;又比如只要加上了(:file-list="fileList")属性,希望能手动控制上传列表的时候,上…
  13. redux(一)基础概念 搞事情,搞事情,搞事情,又换技术栈了,学过的Vue没鸡儿用了。那就介绍介绍React全家桶中蛋疼的Redux。 Redux是什么我就不多说了,因为以前看过Vuex,以为会上手简单点,嗯….确实简单点,但是还是很难学啊,进入正题。 Redux的核心概念只有三个:
  14. 总结常见的ES6新语法特性 前言 ES6是即将到来的新版本JavaScript语言的标准,他给我们带来了更“甜”的语法糖(一种语法,使得语言更容易理解和更具有可读性,也让我们编写代码更加简单快捷),如箭头函数(=&gt;)、class等等。用一句话来说就是:
  15. FEZ前端模块化工程开发框架 FEZ 是面向前端模块化工程的开发框架。主要目的是统一前端开发模式和项目开发结构,自动化前端工作流,提高开发效率和开发质量。使用持续集成等软件工程的架构模式,集成众多业界先进的解决方案,让研发人员更专注于业务逻辑的实现。核心包括功能模块化、结构规范化、及开发自动化。 FEZ倡导的前端开发理念 …
  16. 玩转HTML5 Video视频WebVTT字幕制作与样式控制 byzhangxinxu from http://www.zhangxinxu.com/wordpress/?p=7421 本文可全文转载,但需得到原作者书面许可,同时保留原作者和出处,摘要引流则随意。 一、HTML5 Video视频与WebVTT字幕 HTML5 Video视频支持支持外挂字幕,文件后缀名是 .vtt ,称为WebVTT格式,专门的web字幕格式。使用很简单,用一个 <track…
  17. React 深入系列3:Props 和 State React 深入系列,深入讲解了React中的重点概念、特性和模式等,旨在帮助大家加深对React的理解,以及在项目中更加灵活地使用React。 React 的核心思想是组件化的思想,而React 组件的定义可以通过下面的公式描述:
  18. [英] 机器学习驱动打包——JavaScript工具的未来 Tools based on machine learning techniques allow us to perform data-driven chunk clustering and pre-fetching for single-page appli
  19. 记 fastHTTP 协程池的实现 golang的net/http包实现了处理连接时比较简单粗暴,相比之下有性能更好的http库,项目里用到过的fasthttp就是一个很好的实现,Go开发HTTP的另一个选择fasthttp中总结了它跟标准库实现的几点不同: net/http的实现是一个连接新建一个 goroutine,fasthttp是利用一个 worker pool做了协程池,复用 goroutine,…
  20. Vant 1.0 正式发布:轻量、可靠的移动端 Vue 组件库 Vant 是有赞前端团队维护的移动端 Vue 组件库,提供了一整套 UI 基础组件和业务组件。通过 Vant 可以快速搭建出风格统一的页面,提升开发效率。 一、关于 Vant 1.0 距离 Vant 首次发布刚好过去了半年时间,在这半年时间里 Vant 团队
  21. TypeScript:拥有超能力的 JavaScript(下) 原文地址:TypeScript — JavaScript with superpowers — Part II 原文作者:Indrek Lasn 译文出自:掘金翻译计划 本文永久链接:github.com/xitu/gold-m… 译者:jonjia 校对者:
  22. iClient-JavaScript 9.0.1,增强客户端计算与三维能力 iClient-JavaScript 9.0.1发布,增强客户端计算与三维能力。具体特性有: 集成Turf.js,提供空间分析、拓扑分析、等值分析、量算等客户端计算能力, 无需连接GIS服务也可在客户端快速的进行各种常用的空间操作 集成 ECharts / ECharts GL / D3.js 可视化库的三维专题图、风图等更多特效…
  23. 为vue项目添加骨架屏 – xiaOp的博客 前段时间阅读了饿了么的 PWA 升级实践一文,受益匪浅。其中构建时使用 Vue 预渲染骨架屏一节,为开发者提供了减少白屏时间,提升用户感知体验的新思路。本文将借鉴这一思路,尝试为 Vue 项目添加骨架屏。骨架屏是什么?在 Google 提出的以用户为中心的四个
  24. React文档精读(上篇) pre-notify React中的element是什么 条件渲染 element和component 渲染React Element component与pure function 函数式组件和类组件 state/状态 setState state
  25. [英] What’s New in JavaScript Frameworks — March 2018 Follow @__jhannah Welcome to the first edition of a new feature here on JavaScript Report. Each month we’ll go over the impor
  26. 你不知道的Vuejs – 定制开发项目模板 by yugasun from yugasun.com/post/you-do… 本文可全文转载,但需要保留原作者和出处。 有了前面几篇文章的铺垫,我相信我们回过头来再看看用 vue-cli 脚手架工具初始化的项目,就很好理解了。本篇将带着大家全面认识下用
  27. 使用Vue制作切口盒子组件 今天看到@Chris Coyier刚发的 一篇帖子 ,使用CSS怎么写一个切口盒子(Notched Boxes)?其实这个效果早在@Lea Verou的CSS Secrets一书中有一个专门的小节介绍 CSS怎么实现这个斜切口的效果 。所以说这不是什么新东西。不过接下来的内容和前面还是略有不同。 使用到的技术 @Lea Verou曾经介绍了几种实现盒子斜切口…
  28. 从babel讲到AST 前言 最近给团队分享了一篇babel原理,然后我把他整理成一篇blog,本篇总字数6059(含代码),速读3分钟,普通阅读5分钟,有兴趣的可以关注一下我的github博客 babel 我们来看一段代码: .map(n =&gt; n + 1);
  29. 基于React的脚手架搭建 目的 为了能够在工作中更加快速的搭建起开发环境,所以在create-react-app的基础之上结合自身公司业务和个人习惯,搭建了个更加方便的脚手架。GitHub地址 技术栈 react // mvm框架 typescipt // 开发语言 sass //

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

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


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流