20180114 前端开发日报

HTTP/2 幕后原理;iKcamp|基于Koa2搭建Node.js实战(含视频)☞ 处理静态资源;完全理解 React Fiber;WebVR 开发教程:web Audio 实现 3D 音效;我在使用 React Native/Redux 开发中犯过的 11 个错误;Nuxt.js 踩坑分享;优达学城(Udacity)前端样式指南;一个 Vue 组件:实现子元素 scroll 父元素容器不跟随滚动(兼容PC、移动端)

  1. HTTP/2 幕后原理 “  HTTP/2 的首要目标是改善 Web 应用程序用户的体验。作为一个二进制协议,它拥有包括轻量型、安全和快速在内的所有优势。HTTP/2 保留了原始 HTTP 协议的语义,但更改了在系统之间传输数据的方式。这些复杂细节主要由客户端和服务器管理,
  2. iKcamp|基于Koa2搭建Node.js实战(含视频)☞ 处理静态资源视频地址:https://www.cctalk.com/v/15114923882788 处理静态资源 无非花开花落,静静。 指定静态资源目录 这里我们使用第三方中间件: koa-static 安装并使用 安装 koa-static: {代码...} 修改 app.js,增加并...
  3. 完全理解 React Fiber 从“已知-求-解-举一反三的角度”全面理解 React Fiber。
  4. WebVR 开发教程:Web Audio 实现 3D 音效 VR 音频的输出硬件主要是耳机,根据音频源与场景之间的关系,可将 VR 音频分为两类:静态音频和空间化音频。
  5. 我在使用 React Native/Redux 开发中犯过的 11 个错误 译文一篇,React Native 项目开发经验总结。
  6. Nuxt.js 踩坑分享 本文主要分享 Nuxt.js 开发、构建过程中遇到的坑,如预编译的支持、浏览器环境的 window 对象支持以及 ENV 的配置等。
  7. 优达学城(Udacity)前端样式指南 HTML 样式指南 CSS 样式指南 JavaScript 样式指南 Git 样式指南 样式指南英文版:
  8. 一个 VUE 组件:实现子元素 scroll 父元素容器不跟随滚动(兼容PC、移动端) 介绍 我们经常遇到一种情况。当滑动滚动条区域时,子元素滚动条到底部或顶部时就会触发父级滚动条,父级滚动条同理会继续向上触发,直至body容器。这是浏览器默认的滚动行为。 但是很多情况,我们想要子元素滚动完成后,不触发父元素的滚动,比如 moda
  9. 我是如何使用React+Redux构建大型应用的背景 我们团队有个项目由于开发时间较长,且是前后端杂糅的开发方式,维护成本很高,在线上暴露的问题很多。而且因为对接了公司一百多条产品线,每天都会接到大量的客诉和产品线反馈的问题。2017年11月份以产品为...
  10. 如何在React组件“外”使用父组件的Props?     在写SDK项目的时候碰到一个问题:在直播间初始化SDK时使用默认主题,在专题页初始化SDK时使用其它主题。默认主题在打包时挂在全局环境下供多个页面使用,定制主题需要在初始化SDK的时候传入。  &nbs
  11. Vue结合HTML5拖放API 实现目录拖拽~ 拖放事件 dom被拖拽--->经过一些dom--->到达指定dom 被拖拽的dom:(源对象) dragstart 源对象被拖拽 drag 源对象拖拽过程中 dragend 源对象拖拽结束(drop事件后执行) 拖拽过程中经过的dom:(过
  12. React组件的DidMount事件里的setState事件 参考原文: React 源码剖析系列 - 解密 setState setState 之后发生了什么 —— 浅谈 React 中的 Transaction 无法多次setState React组件的componentDidMount事件里使用setS
  13. 前端慌不慌?用深度学习自动生成 HTML 代码 如何用前端页面原型生成对应的代码一直备受关注的问题,文章作者根据 pix2code 等论文构建了一个强大的前端代码生成模型,并详细解释了如何利用 LSTM 与 CNN 将设计原型编写为 HTML 和 CSS 网站。
  14. 拥抱D3js——在react中搭建d3力导向图 D3js力导向图搭建 d3js是一个可以基于数据来操作文档的JavaScript库。可以使用HTML,CSS,SVG以及Canvas来展示数据。力导向图能够用来表示节点间多对多的关系。 实现效果:连线有箭头,点击节点能改变该节点颜色和所连接的线的粗细,缩放、拖
  15. 深入理解React源代码 IV (英文预览版) We have completed the rendering process of a simple component. This time we are going to explore more ramifications of this proces
  16. React系列——react-hot-loader bug排除指南(翻译)原文 react-hot-loader故障排除指南 翻译 这个文件可以作为设置React Hot Loader的常见问题的repository,以及解决方案。知道一个问题?你可以随意提交一个PR。 它应该是什么样子? 页面加载时 保存一个文件时 如...
  17. 40+ 行 JS 代码打造你的 2048 游戏 AI 2048 游戏是什么? 2048 游戏如下图所示,它由一个 4*4 共 16 个方块组成。玩家可以通过「上下左右」四个方向操纵方块滑动,滑动时两个相邻且数值相同的方块会合并,新的方块,数值为两者之和。当游戏里任意方块的数值达到 2048,即为胜利。 我们将使
  18. 漫画图解 JavaScript 引擎: let jsCartoons = ‘Awesome’; 在之前的文章中,我们从事件执行机制详细地讲解了 JavaScript 引擎是如何工作的,同时也简略地提到了编译的知识。是的,你没看错。JavaScript 是编译的,尽管它并不像其它语言编译器有可以进行提前优化的构建阶段,JavaScript 不得不在最后一秒编译代码 —— 从字面上看。用于编译 JavaScript 的技术有一个十分恰当的名字...
  19. 深入理解React源码 - 首次渲染 IV Photo by Joshua Sortino on Unsplash 本文也同时发表在我的博客和HACKERNOON 深入理解React源码 - 首次渲染 I 深入理解React源码 - 首次渲染 II 深入理解React源码
  20. vuex 基本入门和使用(二) vuex 版本为^2.3.1,按照我自己的理解来整理vuex。 关于 state 每个vuex 应用只有一个 store 实例,所以使用起来不会太复杂,对于定位错误状态和操作会很方便。 简单用法:在vuex 的计算属性中返回vuex 的状态 最基本的使用方式
  21. ES6小点心之通用弹窗 小点心,顾名思义,开箱即食,拿来即用。 前端业务逻辑主要分为【交互效果】和【数据展示】两方面。数据展示可使用 MVVM 框架来实现。前端的交互效果常用的也就那么几种,比如弹窗,楼层定位,倒计时,下拉刷新,上拉加载更多等等。这些交互效果完全可以提出来做成
  22. JS设计模式入门和框架中的实践本文为饥人谷讲师slashhuang原创文章 在编写JS代码的过程中,运用一定的设计模式可以让我们的代码更加优雅、灵活。 下面笔者就结合诸如redux的subscribe、ES6的class、vue里面的$dispatch、jquery里面的on/off来...
  23. 使用 Karma + Jasmine 构建 Web 测试环境 使用 Karma + Jasmine 构建 Web 测试环境 简介 现在,越来越多的 Web 框架涌现了出来,令人眼花缭乱。随着浏览器的不断演化,一些前端框架开始尝试将服务器端的功能与技术在浏览器端实现,比如 AngularJS , ExtJS
  24. 我在使用 React Native / Redux 开发中,犯过的 11 个错误 在使用React Native近一年之后,是时候分享一下我刚开始用RN开发项目时犯过的错误了。 1.错误的估计 有可能你对第一个React Native(RN)应用程序的预估是完全错误的! 1)你需要分别考虑iosAndroid版本的布局!在布局的时候,有很多组件可以重复使用;如果ios和Android的页面结构不同...
  25. vue数据传递--我有特殊的实现技巧前言 最近碰到了比较多的关于vue的eventBus的问题,之前定技术选型的时候也被问到了,vuex和eventBus的使用范围。所以简单的写一下。同时有一种特殊的实现方案。 有这么几种数据传递方式,vuex、props、eventBus...

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

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

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