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

2017年10个最好的Javascript和CSS库；读懂源码：一步一步实现一个 Vue；利用FormData对象实现AJAX文件上传功能及后端实现；jquery template.js前端模板引擎；面向前端工程师的机器学习引导课；AST in Modern JavaScript；css3背景颜色渐变属性；将网站转换为渐进式 Web 应用程序之简易教程

2017年10个最好的Javascript和CSS库 localForage 用于indexedDB和WebSQL的封装程序，可以提高Web应用程序在本地存储数据以便脱机使用的能力。读写操作与localStorage类似，但是可以保存许多类型的数据，而不是只保存字符串。它还提供了一个双重API，使开发人员可以选择使用回调或promises。 AOS AOS是一个CSS库，允许您添加滚动动画效果。 …
读懂源码：一步一步实现一个 Vue 源码阅读：究竟怎样才算是读懂了？市面上有很多源码分析的文章，就我看到的而言，基本的套路就是梳理流程，讲一讲每个模块的功能，整篇文章有一大半都是直接挂源码。我不禁怀疑，作者真的看懂了吗？为什么我看完后还是什么都不懂呢？事实上一个经过无数次版本
利用FormData对象实现AJAX文件上传功能及后端实现包括HTML基础设置、CSS界面优化、JS利用FormData对象和AJAX进行上传、后端接收文件并存储到指定路径以及删除文件操作。基础的设置： <form enctype="multipart/form-data"> <input id="file" type="file" multiple="multiple" name="file" accept=&q…
jquery template.js前端模板引擎作为现代应用，ajax的大量使用，使得前端工程师们日常的开发少不了拼装模板，渲染模板在刚有web的时候，前端与后端的交互，非常直白，浏览器端发出URL，后端返回一张拼好了的HTML串。浏览器对其进行渲染。html中可能会混有一些php(或者php中混有一些html)。在服务端将数据与模板进行拼装，生成要返回浏览器端的html串…
面向前端工程师的机器学习引导课 “按照目前的发展，将来人工智能会跟所有人产生紧密关联。前端工程师也是人类，作为人类，应该在某种程度上了解人工智能，而后能更好地使用人工智能的产品。”
AST in Modern JavaScript 同步自本人简书博客 What is AST 什么是AST?AST是Abstract Syntax Tree（抽象语法树）的缩写。传说中的程序员三大浪漫是编译原理、图形学、操作系统，不把AST玩转，显得逼格不够，而本文目标就是为你揭示AST在现代
【css3背景颜色渐变属性】尽管Mozilla和Webkit通常对CSS3属性采取同样的语法，但是对于渐变，他们很不幸的不能达成一致。Webkit是第一个支持渐变的浏览器内核，它使用下面的结构： #前端开发博客#
将网站转换为渐进式 Web 应用程序之简易教程基本上来说，PWA 是一个网站，当用手机访问时，网站可以保存在手机，并且体验就像一个原生应用程序一样。它会有一个加载显示，你可以删除 Chrome 的界面，如果网络连接断开，它仍然可以正常显示内容。最重要的是它提高了用户的参与度：在 Android 上的 Chrome 浏览器（不确定其他移动端浏览器上行为是否一致）如果检测到…
Vue 第一个组件，浏览器后退无法触发beforeRouteLeave的问题与解决现象加载第一个组件（这里的第一个意思是浏览器历史记录的第一个，后文称为待监听组件）时，正常跳转其他页面可以触发beforeRouteLeave。但是按浏览器的后退按钮监听不到该事件。解决方案目前采用比较土且不实用的解决方案。加一层组件，再router.push到待监听组件，使得待监听组件非…
2017 年度盘点：15 个最流行的 GitHub 机器学习项目选自Analytics Vidhya 作者：Sunil Ray 机器之心编译在本文中，作者列出了 2017 年 GitHub 平台上最为热门的知识库，囊括了数据科学、机器学习、深度学习中的各种项目，希望能对大家学习、使用有所帮助。另，小编恬不知耻地把机器之心的 Github 项目也加了进来，求 star，求 pull r…
谈谈React–componentWillReceiveProps的使用什么是componentWillReceiveProps？ componentWillReceiveProps是React生命周期中的一个环节，有关React的生命周期，同学们可以在这里详细了解。 componentWillReceiveProps在初始化r
这里有没有你想要的react-router由于React Router 4.0已经正式发布，所以该博文分React Router 和 React Router 4.0 进行分类讨论！该博文会持续更新中，欢迎大家一起讨论与补充！我相信用过react一般都用过react-router，那就很有必要说说用re…
使用Vue开发的谷歌扩展，获取音乐下载地址使用Vue开发的谷歌扩展，获取音乐下载地址目前支持网易云音乐，QQ音乐，百度音乐，酷我音乐 Build Setup # 安装NPM模块 npm install # 运行 at localhost:8080
webpack提取第三方库的正确姿势我们在用webpack打包是时候，常常想单独提取第三方库，把它作为稳定版本的文件，利用浏览缓存减少请求次数。常用的提取第三方库的方法有两种 CommonsChunkPlugin DLLPlugin 区别：第一种每次打包，都要把第三方库也运行打包一次，第二种方法每次打包只打包项目文件，我们只要引用第一次打包好的第三方压…
如何改善既有 JS 代码：修复常见的 ESLint 报警（二）前言 ESLint 是目前最主流、最强大的 JS 代码校验工具。当我们的代码触发了 ESLint 的报警规则时，ESLint 就会提示错误时。本系列文章将详细讲解那些需要手工介入修复的 ESLint 规则，帮助你顺利地把既有代码迁移到 ESLint 的保护之中。 no-return-assign 禁止 return 一个赋值表达式。虽然函数允…
Webpack实战-管理多个单页应用引入问题上一节3-9为单页应用生成HTML中只生成了一个 HTML 文件，但在实际应用中一个完整的系统不会把所有的功能都做到一个网页中，因为这会导致这个网页性能不佳。实际的做法是按照功能模块划分成多个单页应用，每个单页应用生成一个 HTML 文件。并且随着
跟着Vue-cli来’学’并’改’Webpack之多环境配置和发布 Vue之所以现在如此之火热，一部分也得益于有官方的脚手架生成工具Vue-cli,大大简化了初学者环境搭建的成本，但是实际业务中我们往往需要实现其他的功能来对webpack进行改造，本文将会根据一些实际的业务需求，先学习vue-cli生成的模版，然后在进行相关修
简单案例浅析JS线程机制故事的开始是这样的，有一个需求，需要将一个List的数据加载到页面上展示。需求看上去很简单对吧，但是由于List数据量巨大，并且需要对List里的每个对象进行一定的操作。所以呢，每次都会造成几秒钟的浏览器假死，这对用户的体验简直是杀伤性的。 //最初的方法 function original(myList){ for (var i; i &l…
CSS 工程化演进 “CSS 本身并无编程特性，但在其工程化技术的发展中缺不乏很多优秀的编程思想，无论是自定义的 DSL 还是基于 JS，这其中带给我们思考的正是编译思想。”
原生JS控制多个滚动条同步跟随滚动在一些支持用 markdown 写文章的网站，例如掘金或者 CSDN 等，后台写作页面，一般都是支持 markdown 即时预览的，也就是将整个页面分成两部分，左半部分是你输入的 markdown 文字，右半部分则即时输出对应的预览页面，例如下面就是 CSDN 后台写作页面的 markdown 即时预览效果：本文不是阐述如何从 0 …
用 CSS 选择器和自定义属性来升级你的项目原文地址：Upgrade Your Project with CSS Selector and Custom Attributes 原文作者：Tim Harrison 译文出自：掘金翻译计划本文永久链接：github.com/xitu/gold-m… 译者：
前端开发规范之React应用使用ESLint ESLint 由 Nicholas C.Zakas 编写，目标是以可扩展、每条规则独立、不内置编码风格为理念编写一个 Lint 工具。用户可以定制自己的规则作成公共包。 ESlint主要有一下特点：默认规则包含所有 JSLint 、 JSHint 中存在的规则，易迁移规则可配置性高，可设置 "警告&qu…
译：用let 和 const 来指导JavaScript 的变量提升最近在Medium上看到一篇关于“变量提升”的文章，原文在此：《A guide to JavaScript variable hoisting with let and const》。为了培养自己看英文文档习惯且看懂的需要，就翻译一下。谈不上精确，欢迎指正。对于…
ES6 Promise 和 Async/await的使用你可能知道，Javascript语言的执行环境是"单线程"（single thread）。所谓"单线程"，就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。这种模式的好处是实现起来比较简单，执行环境相对单纯；坏处是只要有一个任务耗时很长，后面的…
《JavaScript 打怪升级 —— 把业务逻辑当练习题做》开发项目和出没社区有一段时间了，会遇上一些比较有印象业务需求。这些业务需求的实现逻辑都值得一写。因为这些业务逻辑可以当做练习题一样，可以给大家练手。（by 守候）
将typescript+react的webpack项目迁移到parcelparcel简介 Parcel, 是一个网络应用打包工具, 适用于经验不同的开发者. 它利用多核处理提供了极快的速度, 并且不需要任何配置. 项目github地址 ts-react(webpack) ts-react-parcel 现状对于现阶段来说, 对已有的…
让进程间通信更容易 – Pandora.js 的 IPC-Hub 我们前面的两篇介绍了怎么定义多个进程，怎么利用进程这一资源。我们在淘宝业务中也是这样实践的，有一个问题也越发明显，进程间如何通信呢？起初我们有一个比较简单的 IPC 实现，通过 Domain Socket 进行通信。也是传统的 C/S 架构的，两个进程间进行比较基础的消息通信（比较类似 Node-IPC 这个包）。不过实在…
MultiHttp：高性能 PHP 封装的 HTTP Restful 多线程并发请求库 This is high performance curl wrapper written in pure PHP. It’s compatible with PHP 5.4+ and HHVM. Notice that libcurl version must be over 7.36.0, otherwise timeout can not suppert decimal. 这是一个高性能的PHP封装的HTTP Restful多线程并发请求库，参考借鉴了httpresful 、multirequest等优秀…
【20171223 前端开发日报】JavaScript 数组遍历方法的对比；两行 CSS 代码实现图片任意颜色赋色技术；JS原生交互；从 webpack 到全面拥抱 Parcel #2 让 Parcel 支持 vue；如何在不同的项目中共用前端资源,告别复制粘贴；优质前端频道汇聚；如果…详情→
【纯CSS3使用vw和vh视口单位实现自适应】vw : 1vw 等于视口宽度的1%，vh : 1vh 等于视口高度的1%。本文介绍纯CSS视口单位vw和vh来自行自适应，虽然现在的兼容性还没法完全能够接受，但不妨碍你认识这个vw和vh的强大。 #前端开发博客#