20180822 前端开发日报

使用babel避免webpack编译运行时模块依赖;Vue监听对象及对象属性;#hello,JS:11JS脚本异步加载专题;webpack打包(有面试题);前端架构之vue+axios 前端实现登录拦截(路由拦截、http拦截);计算树结点路径的一种Javascript的实现;React组件隔离;Generator:JS执行权的真实操作者

  1. 使用babel避免webpack编译运行时模块依赖 引言 babel是一个非常强大的工具,作用远不止我们平时的ES6 -> ES5语法转换这么单一。在前端进阶的道路上,了解与学习babel及其灵活的插件模式将会为前端赋予更多的可能性。 本文就是运用babel,通过编写babel插件解决了一个实际项目中的问
  2. vue监听对象及对象属性监听整个对象,使用watch就行 {代码...} 监听对象中具体属性的变化,需要使用watch配合computed {代码...}
  3. #hello,JS:11JS脚本异步加载专题 前言: 在梳理知识点的时候,发现作为浏览器渲染中的机制之一——异步加载机制,当用户访问站点,需要下载各种资源,例如JS脚本,CSS,图片,iframe等,它是实现现代网站进行加载页面时一种必不可少的手段。查资料加上老师拓展课程均对于异步加载机制还有很多方法可以
  4. webpack打包(有面试题)1.打包入口 {代码...} 2.css文件处理 引入css css-loader 在较新的版本中使用mini-css-extract-plugin提取css文件 3.本地开发服务器:webpack-dev-server 路径重定向,支持https,浏览器中可以显示编译错误,可以...
  5. 前端架构之vue+axios 前端实现登录拦截(路由拦截、http拦截) 前言:之前写了一个node的jwt认证,为了能和node对应,跑通整个流程,前端将设置登录拦截,分别为路由拦截,http拦截。更多文件请看 github地址和node server 对应:前端架构之node jwt认证大致流程:在进行路由跳转时,利用vue-r
  6. 计算树结点路径的一种Javascript的实现树结构如下: {代码...} 主要算法如下: {代码...} {代码...} 运行结果: {代码...}
  7. React组件隔离 用技术改变生活,用生活完善技术。来自微播易一枚向全栈方向努力奔跑的前端工程师。 微信同步:wDxKn89 前言 组件隔离适用范围 同一个页面引用多个相同的自定义公共组件(该类组件拥有自己的Redux)并且这些组件之间有交互。 案例背景 在一个页面中存在两个
  8. Generator:JS执行权的真实操作者ES6提供了一种新型的异步编程解决方案:Generator函数(以下简称G函数)。它不是使用JS现有能力按照一定标准制定出来的东西(Promise是如此出生的),而是具有新型底层操作能力,与传统编程完全不同,代表一种新...
  9. 聊聊 Git 原理 说起Git,相信大家都很熟悉了,毕竟作为程序猿,每天的业余时间除了吃饭睡觉就是逛一下全世界最大的开(tong)源(xing)代(jiao)码(you)网站GitHub了。在那里Git是每个人所要具备的最基本的技能。今天我们不聊Git的基本应用,来聊一聊Git的原理。<!-- more --> Git给自己的定义是一套内存寻址文件...
  10. 如何读取 JSON 里嵌套的深层数据?我这儿有各语言通用方案 前言 使用JSON格式进行多个端特别是前后端之间通信已成为主流方案之一, PHP、java、objectC、JavaScript 这几种语言是我所在团队接触比较多的主要开发语言。 有一个问题 有时候,很多时候,从接口给出的数据会存在数据嵌套现象,比如在一款记
  11. Web 应用架构入门之 11 个基本要素 译者: 读完这篇博客,你就可以回答一个经典的面试题:当你访问Google时,到底发生了什么? 原文:web Architecture 101 译者:Fundebug 为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,翻译仅用于学习。 当我还是小白的时候,如果知道Web应用架构就好了! ...
  12. vuex工作原理详解 前言 vuex作为vue官方出品的状态管理框架,以及其简单API设计、便捷的开发工具支持,在中大型的vue项目中得到很好的应用。作为flux架构的后起之秀,吸收了前辈redux的各种优点,完美的结合了vue的响应式数据,个人认为开发体验已经超过了Rea
  13. 我用Vue和React构建了相同的应用程序,这是他们的差异 在工作中使用了Vue之后,我已经对它有了相当深入的了解。同时,我也对React感到好奇。我阅读了React的文档,也看了一些教程视频,虽然它们很棒,但我真正想知道的是React与Vue有哪些区别。这里所说的区别,并不是指它们是否都具有虚拟DOM或者它们如何渲染页面。我真正想要做的是对它们的代码进行并排比较,并搞清楚在使...
  14. 使用 Vue 编写一个长按指令 原文链接:Building a long press directive in Vue 译者:OFED 使用 Vue 编写一个长按指令 有没有想过只需按住一个按钮几秒钟就能在你的 Vue 应用中触发一个功能? 有没有想过创建一个按钮,按下一次就可以清除单次
  15. 2018年7月GitHub开源项目排行榜】最近,7 月份最热门的 GitHub 项目已经诞生,本文列举了 9 个最热门的开源项目,以供开发者参考和使用。 ​​​
  16. 前端每日实战:112# 视频演示如何用纯 CSS 创作切换背景的按钮悬停效果效果预览 按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。 [链接] 可交互视频 此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 请用 chrome, safari, edge 打开观看。 [链接] ...
  17. 前端单测的那些事 前言 因为经常需要维护一些大型的业务项目和一些自己的开源项目,所以为了更好的“规范”代码质量和迭代的稳定性,开始写了一些单测。下面也主要是自己的一些总结吧,由于测试工具和框架很多,这里只介绍一些browser端常用的测试工具,文中如果有问题也欢迎拍正!!
  18. 2018年7月份GitHub上最热门的JavaScript项目】7 月份 GitHub 上最热门的JavaScript项目排行已经出炉啦,在本月的名单中,又有哪些热门的新项目加入呢?一起来看看。详见 ​​​

    2018年7月份GitHub上最热门的JavaScript项目
  19. 通过Recompose库掌握React函数组件 原文地址:https://blog.usejournal.com/mastering-react-functional-components-with-recompose-d4dd6ac98834 原文作者:Ilya Suzdalnitski
  20. 什么是 Dweb?(中英) 原文:hacks.mozilla.org/2018/07/int… 作者:Dietrich Ayala&nbsp;发表时间:July 31, 2018 译者:西楼听雨&nbsp; 发表时间:2018/8/18 原文是 Mozilla 开发者网站发布的关于 Dw
  21. ES6指北【5】——展开语法(spread syntax)展开语法(Spread syntax), 可以在函数调用/数组构造时, 将数组表达式或者string在语法层面展开;还可以在构造字面量对象时, 将对象表达式按key-value的方式展开。(译者注: 字面量一般指 [1, 2, 3] 或者 {name: "m...
  22. 前端架构之node jwt认证 前言:这次使用node express jwt实现一个小小的认证,数据库之类的慢慢在添加上去,先跑通整个流程,基本上是可以使用到项目里面的了。这次就不用gulp编译了,添加了log4.js一个错误日志,还稍微做了一下压测。就不详细展开了,有兴趣的可以下载来看:
  23. React 源码全方位剖析当时在各种前端框架或库充斥市场的情况下,出现了大量优秀的框架,比如 Backbone、Angular、Knockout、Ember 这些框架大都采用了 MV* 的理念,把数据与视图分离。而就在这样纷繁复杂的时期,React 诞生于 Faceboo...

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

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

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