20181115 前端开发日报

高手篇 【为何要再封装 AJAX】？；基于 Beego + Vue 开发的在线问答社区 – 暗黑系风格；Chrome 72 更快的异步函数和 Promise；前端常用插件、工具类库汇总（下）；浅谈未来几年前端的发展方向；一个vue前端的VSCODE插件分享（2018）；ES6 Fetch API HTTP请求实用指南；Web移动端适配总结

1. 高手篇 【为何要再封装 AJAX】？ 再 封装AJAX 所带来的好处是你想象不到的! 无论是对于代码的 高效管理 ，还是 系统的设计 …其收益远远超出你的想象。更重要的一点是：别人一看你的代码心里就有数了， 高手，一定是高手… 为何需要在封装 我们先来看看以下应用场景，项目中涉及100个 AJAX 请求 ，其中： 其中60个需要在 请求头header …
2. 基于 Beego + Vue 开发的在线问答社区 – 暗黑系风格 项目地址： https://github.com/Qsnh/goa 演示地址：http://goaio.vip 介绍 基于 Beego + Vue 开发的在线问答系统。 功能 邮箱注册 邮件密码找回 会员邮件激活 markdown内容提问和回答 XSS安全过滤 Vue前端小组件 完善的会员功能体系 …
3. Chrome 72 更快的异步函数和 Promise Chrome 72 中的 async 和 await 性能更快，Promise 性能提升 8 倍，增加方便开发者调试和定位 bug
4. 前端常用插件、工具类库汇总（下）对本文感兴趣可以先加个收藏，也可以转发分享给身边的小伙伴，以后遇到类似的场景就来看看具体的插件及其用法。
5. 浅谈未来几年前端的发展方向 在知乎上看到这么一个问题，觉得很有意思，以下是原提问者的见解 过去五年前端的发展过程基本上是一个工程化的过程,框架和工程化工具层出不穷。 近两年其实发展已经比较迟滞了。 框架方面:基本就是三大框架鼎立的局面,三大框架都在相互借鉴吸收,而且方向各有侧重,未来短时间内我看格局不可能有什么大变化. …
6. 一个vue前端的VSCODE插件分享（2018） background 给编辑器窗口加个背景！唯一的缺点是vscode会显示已损坏，当然啦，并不影响使用 可以参考以下配置 "background.useDefault": false, "background.style": { "content": "”", "pointer-events": "none", …
7. ES6 Fetch API HTTP请求实用指南 本次将介绍如何使用Fetch API（ES6 +）对REST API的 HTTP请求，还有一些示例提供给大家便于大家理解。 注意：所有示例均在带有箭头功能的 ES6中给出。 当前的Web /移动应用程序中的一种常见模式是从服务器请求或显示某种数据（例如用户，帖
8. Web移动端适配总结 一. 1px边框问题 想必各位无论在面试中，还是工作中，应该遇到过1px边框的问题。不知道也没关系，现在我们就来复习一下（知道的朋友可以跳过去看第二部分了）。 1px边框，顾名思义就是前端画出1px的线，这里的1px,指的是屏幕1px大小。那么屏幕的1px和c
9. 双十一在家学用 git 对于所有的开发者来说，掌握一门代码版本控制系统都是必须的，无论是自己做项目，团队合作，工作中的合作，都离不开版本控制系统的帮助。然而目前大多数初学的开发者还不了解或者还停留在几个常用的指令，那么毫无疑问是不够的。详细的了解 Git 和如何高效的使用 Git 是
10. JavaScript异步处理的那些事儿 前言 原文 之前总结了关于 JavaScript 异步的 事件循环与消息队列 机制以及 ES6 带来的 微任务与宏任务 的知识。传送门 下面是关于JS异步处理的各种方案： callback >> ES6 Primise >> async
11. 前端国际化的另类方式一个项目发展到一定的环境或者一开始就是为多国打造的，就需要考虑国际化了。简单来说，就是一套页面，多套语言。
12. js和原生应用常用的数据交互方式 在原生app中经常会使用到H5页面，比如说电商中的活动页，一些电商中的详情页，等等…这些页面都有一个特点，那就是在未来修改的可能性，和一次性的几率特别的大。所以用H5的页面是最睿智的一种选择。 一旦使用了H5那么就少不了和原生开发的一些交互（Android, IOS）如下的方案能够帮助你解决。 其实现原理是原生在j…
13. 前端技术周刊 2018-11-12：MVVM 源码分析终于捱过双十一，距上次发刊已经间隔了三周，我们对新闻消息也进行了聚合。如果您喜欢本期的组织方式，请留言告诉我们。
14. vue单页应用中 返回列表记住上次滚动位置、keep-alive缓存之后更新列表数据 那点事 实践场景需求产品列表中，滚动到一定位置的时候，点击查看产品信息，后退之后，需要回到原先的滚动位置，这是常见的需求所有页面均在router-view中，暂时使用了keep-alive来缓存所有页面，所以进入不同分类的产品列表，和不同的产品详情页面，需要更新数据首
15. React 折腾记 – (6) 基于React 16.6 + Antd 3.10.7封装的一个声明式的查询组件 前言 最近把新的后台系统写好了..用的是上篇文章的技术栈(mobx+react16); 但是感觉mobx没有想象中的好用,看到umi 2.x了.就着手又开始重构了… 仔细梳理了下上个系统,发现可以抽离的东西不少 有兴趣的瞧瞧,没兴趣的止步,节约您的时间..
16. 管中窥Vue博客文章链接：管中窥Vue Vue和Angular、React.js的相同点和不同点？ 与React的相同： 都使用了Virtual DOM 提供了响应式和组件化的视图组件 将注意力集中保持在核心库，而将其他功能如路由和全局状态管理交给相…
17. JavaScript使用类似break机制中断forEach循环 JavaScript数组对象，有一个forEach方法，可枚举每一个数组元素，但并不支持类似for循环的break语法，中断循环： .forEach(function(item) { // if(!item) break; 不支持 }); 解决办法，可抛出一个特殊异常，来中断forEach循环，原理： var BreakException = {}; try { .forEach(functi…
18. 完全理解JavaScript中的this关键字 原文 王福朋老师的 JavaScript原型和闭包系列 文章看了不下三遍了，最为一个初学者，每次看的时候都会有一种 "大彻大悟" 的感觉，而看完之后却总是一脸懵逼。 原型与闭包 可以说是 JavaScirpt 中理解起来最难的部分了，当然，我也只是了解到了一些皮毛，对于 JavaScript OOP 更是缺乏经验。这里我…
19. JavaScript DOM元素长宽等比例缩放 我们经常遇到长宽随窗口变化等比缩放的例子，比如视频网上中间的视频案例、等比缩放的盒子图片等等。 公式 我们已经知道根据比例求长宽公式是： 求宽度 w = h / ratio 求高度 h = w * ratio 准备 根据公式此时我们需要准备，一个外容器dom
20. HTML5新特性概述(下) 本篇的html5新特性是下篇，将把html5上篇没有介绍到的新特性分享出来，OK，下面是正文： 1. 拖放（Drag 和 drop） 拖放是html5提供一个新的特性，这个特性增加了拖拽事件的api,和定义可以拖拽的属性。举个例子，在h5之前实现拖拽功能，其实
21. 基于babylon.js的3D网页游戏从零教程 3D 游戏的 javascript 框架： 在很久一段时间 web 端的 3D 游戏引擎一直是 nothing，但现在却如雨后春笋。 Unity （Unity 2018.2 开始已经彻底弃用 js，使用 C#） Three.js（比较底层的框架，只是一个渲染
22. React源码系列(四): Fiber Tree && commit React16源码阅读系列分享 喜欢的可以点个 watch/start 后面还会更新
23. JS数组中的indexOf方法这两天在家中帮朋友做项目，项目中使用了数组的indexOf 方法，找到了一篇文章，感觉非常不错，顺便整理下以防链接丢失。
24. 【英】CSS 和网络性能 9 November, 2018 CSS and Network Performance Written by Harry Roberts on CSS Wizardry. Despite having been called CSS Wizardry for
25. 如何使用marked.js使Markdown在网页上良好的展示（vue + element ui） 先上成果图 网页的布局 网页布局分为三部分，分别是 头部header，固定定位 侧边栏aside，固定定位 内容contain，静态定位, margin-top值为header的高度，margin-left的值为aside的宽度，是router-view的出口。分为两部分： 主内容，显示md转换后的html页面，margin-right值为md目…
26. ReactNative三端同构实战 本文讲解了React Native三端同构的应用场景、实现原理，并对比了目前成熟的实现方案react-native-web和reactxp，以及接入它们的实践经验。
27. git如何清空所有的commit记录 前言 为什么要清空 git 中的 commit 记录？ 大多数开发者喜欢在 github 创建自己的 Repository，而后进行持续开发，然后就是不断的 add、commit、push 等,中间难免会把自己比较重要的隐私信息 push 到远端 origi
28. zanePerfor前端性能监控系统高可用之Mongodb副本集读写分离架构 HI!，你好，我是zane，zanePerfor是一款最近我开发的一个前端性能监控平台，现在支持web浏览器端和微信小程序段。我定义为一款完整，高性能，高可用的前端性能监控系统，这是未来会达到的目的，现今的架构也基本支持了高可用，高性能的部署。实际上还不够，在
29. webpack+git开发环境将git中tag自动显示到web中 问题由来: 系统通常是要显示版本信息的,但是,这之前做的web都是手动打tag,并手动将web中的version版本更新, 如果能将git中的tag版本信息自动添加到web中那是不是很赞? 有了这个想法自然就要探索一下实现方法了, 翻看了一下.git的文件目录,发现里面有个 .gitrefstags 目录,这里面正是要找的tag信息, v1.0 v1.1 v…
30. ES6 系列之模块加载方案前言 本篇我们重点介绍以下四种模块加载规范： AMD CMD CommonJS ES6 模块 最后再延伸讲下 Babel 的编译和 webpack 的打包原理。 require.js 在了解 AMD 规范之前，我们先来看看 require.js 的使用方式。 项目目…

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

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