20181025 前端开发日报-前端开发博客

《从零构建前后分离的web项目》实战 – 欲善其事必先利其器继续打磨前端架构；2018年10月Top 10 JavaScript开源项目；异步Promise及Async/Await可能最完整入门攻略；【vuejs进阶】 vuejs路由实现原理；vue-split-table【表格合并和编辑插件】；vue-cli 3.0新特性解读；实战Vue组件和Mixins；前端技术周刊 2018-10-22：PostCSS

《从零构建前后分离的web项目》实战 – 欲善其事必先利其器继续打磨前端架构工欲善其事必先利其器 – 继续打磨前端架构抱歉生病拖更了，1024快乐本文永久更新地址填坑上回还真的有同学提到了这个问题，感谢细心的你。@_noob 其实是没任何问题的，只不过看起来违背了常见的结构，像是有问题。其实是上文为了照顾初学者，怕大家因为麻
2018年10月Top 10 JavaScript开源项目
异步Promise及Async/Await可能最完整入门攻略此文只介绍Async/Await与Promise基础知识与实际用到注意的问题，将通过很多代码实例进行编写。
【vuejs进阶】 vuejs路由实现原理window.history 对象包含浏览器的历史，window.history 对象在编写时可不使用 window 这个前缀。history是实现SPA前端路由是一种主流方法，它有几个原始方法：
vue-split-table【表格合并和编辑插件】前言 vue-split-table应用的效果图 vue-split-table开源地址,欢迎star,现在已经开源和同步到npm上轻松搞定表格拆分或者合并,编辑,再也不怕被产品怼啦 1.核心源码分析 <td>里面嵌套<table>实现表格拆…
vue-cli 3.0新特性解读在9 月 30 日的Vue.js 伦敦大会上，作者尤雨溪介绍了 Vue 下一个版本将要发布的内容，以及 Vue 3.0 的开发路线，和后面版本的发展情况。虽然，Vue 3.0版本的正式版还没有发布，不过作为vue 项目快速构建工具的vue-cli 早已发布，我们可以通过vue-cli来了解vue 3.0的一些情况。作为Vue的主要版本，Vue 3.0带来了诸多…
实战Vue组件和Mixins 特别声明，本文根据 @Saqueib Ansari 的《 Practical use of Components and Mixins in Vue JS 》一文所整理。这篇文章主要帮助我们深入的学习Vue的组件和 mixins ，它们帮助你扩展基本的HTML元素，用来封装可重用的代码。在较高的层次上，组件是定制的元素，Vue的编译器附加了行为，而 mixins 为你提供了一个保持…
前端技术周刊 2018-10-22：PostCSSChrome 70 已发布，Credential Management API 中新支持了公钥证书，Web Worker 支持 name 参数（此前已在 Firefox、Edge、Safari 中支持），实验性支持了 Web Bluetooth 和 Intervention Reports，支持利用 PWA …
你的.vue文件就已经是你的文档了
高级 vue 组件模式 2 我们需要实现的需求是能够使使用者通过 <toggle> 组件动态地改变包含在它内部的内容。熟悉 vue 的童鞋可能马上会想到不同的解决方案，比如使用 slot 并配合 v-if ，我们这里采用另外一种方法，利用 vue 提供的 provide/inject 属性按照复合组件的思想来实现。这里简单介绍下 provide/i…
前端进阶（14） – 如何提升前端性能和响应速度如何提升前端性能和响应速度下面大多是从前端工程化的角度给出的优化建议，如果需要了解语法上的优化，可以参考：如何提高页面加载速度编写高效的JavaScript Web前端性能优化进阶 – 完结篇 1. 原生 css 动画代…
JavaScript 数组操作方法小结ECMAScript为操作已经包含在数组中的项提供了很多方法。这里本人总结一下自己对这些方法的理解，如此之多的方法中，我首先已是否会改变原数组做为分类标准，逐个解释一下每一个方法。
VUE的总结（1）jQuery中包含了大量的Dom操作，无论怎么操作，都要先找到Dom对象，对它进行操作。频繁操作Dom会导致网页的重绘和重排，比如remove一个节点，当然就要重建Dom树，也肯定对性能有影响。VUE中有虚拟DOM,它的作用就是…
html背景图不随滚轮滚动，而且按住Ctrl并滚动滚轮时，图片不会变大缩小，就像百度的首页一样之前在百度知道我提问过这一个问题，后来解决了。不过好多人来问我时怎么解决的，源码。其实很简单。这里我贴一下代码。有需要的小伙伴不用再加我qq了，直接来这里取吧。
3D 物理世界 – Three.js 与 Cannon.js 介绍与使用在日常的繁忙业务中，项目更多会偏向于 2D 或 2.5D 的视觉风格，因为 2D 项目无论在设计或是开发的周期都会更短，但 2D 缺少 3D 那样的空间感、真实感，正好最近参与了 3D 项目的开发，过程中也遇到了不少问题，通过这篇文章将关于 Three.js、Cannon.js、模型、工具等基础知识和问题分享给大家。开始 3D 项目之前，首…
构建高性能和可扩展性 Node.js 应用的最佳实践 [第 3/3 部分] 本系列的头两篇文章中我们看到如何扩展一个 Node.js 应用以及在应用的代码部分应该考虑什么才能使其在这个过程中运行如我们所愿。在这最后一篇文章中，我们将介绍一些其它实践，以进一步提高应用运行效率和性能。 Web 和 Worker 进程就像你可能知道的那样， Node.js 在实际运行中是单线程的，因此一个进程实…
手把手教你结合commitizen 搭建属于自己的项目git commit 校验工具先丢出最终版的index.js文件内容 {代码…} 步骤一、创建工具项目 1.使用git/gitlab创建一个空的仓库 2.在空仓库中添加index.js 内容如下 {代码…} 使用工具到相应的项目（假设插件名称my-commit） 1.先发布你…
ES6 系列之我们来聊聊 Async async ES2017 标准引入了 async 函数，使得异步操作变得更加方便。在异步处理上，async 函数就是 Generator 函数的语法糖。举个例子： // 使用 generator var fetch = require('node-fetc
漫谈 JavaScript 开销本文来自于 Google Chrome 的一位工程师，致力于研究WEB响应速度。即便是手机性能得到了大幅提升的2018年，JavaScript 的成本消耗在移动端依然不可小觑，那么JavaScript都为我们的用户带来了哪些消耗？又有哪些优化方法？文中包含 YouTube视频，Twitter, 请科学上网。构建交互式网站涉及到向用…
前端每日实战：161# 视频演示如何用纯 CSS 创作一张纪念卓别林的卡片（没有笑声的一天就是被荒废的一天）效果预览按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。 [链接] 可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。 [链接] …
【vuejs面试题】务必熟知的vuejs面试题「务必收藏」(1)、active-class 是 vue-router 模块的 router-link 组件的属性　　(2)、使用 children 定义嵌套路由
前端每日实战：160# 视频演示如何用纯 CSS 创作一个打开内容弹窗的交互动画效果预览按下右侧的“点击预览”按钮可以在当前页面预览，点击链接可以全屏预览。 [链接] 可交互视频此视频是可以交互的，你可以随时暂停视频，编辑视频中的代码。请用 chrome, safari, edge 打开观看。 [链接] …
【如何创建高性能、可扩展的Node.js应用？】在这篇文章中，我们将介绍关于开发 Node.js web 应用程序的一些最佳实践，重点关注效率和性能，以便用更少的资源获得最佳结果。
【2018年9月份GitHub上最热门的Python项目】本文我们将和大家介绍 GitHub 上 9 月份最受欢迎的 11 个Python开源项目，在这些项目中，你有在用或用过哪些呢？详见
问:在指定的JSON数据中（最外层是数组）根据指定条件拿到匹配到的结果{代码…} {代码…} 会从整个数组中遍历满足条件dobj的东西最后的结果会是:
TypeScript基础入门之Javascript文件类型检查(二) 继续上篇文章【 TypeScript基础入门之Javascript文件类型检查(一) 】对象文字是开放式的在.ts文件中，初始化变量声明的对象文字将其类型赋予声明。不能添加未在原始文本中指定的新成员。此规则在.js文件中放宽;对象文字具有开放式类型（索引签名），允许添加和查找最初未定义的属性。例如： var obj = { a:…
vue修饰符–可能是东半球最详细的文档（滑稽）为了方便大家写代码，vue.js给大家提供了很多方便的修饰符，比如我们经常用到的取消冒泡，阻止默认事件等等~
React 新 Context API 在前端状态管理的实践众所周知，React的单向数据流模式导致状态只能一级一级的由父组件传递到子组件，在大中型应用中较为繁琐不好管理，通常我们需要使用Redux来帮助我们进行管理，然而随着React 16.3的发布，新context api成为了新的选择。一、Redux的简介以及缺陷 Redux来源于Flux并借鉴了Elm的思想，主要原理如下图…