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

国内最火的 HTML、CSS、JavaScript 开源项目 Top 榜，你知多少？；网页保存为图片及高清截图的优化 | canvas跨域图片配置；Redux 关系图解；tabris.js+restify+码云打造个人APP；将 Node.js 内置于手机原生应用——以后 Android 和 iOS 可以用 npm 包了？；JavaScript：到底什么是ES6、ES8、ES 2017、ECMAScript?；写给前端应届生的职业规划建议；微前端：将微服务理念延伸到前端开发中

国内最火的 HTML、CSS、JavaScript 开源项目 Top 榜，你知多少？对于开发者而言，想要着手前端开发，HTML、CSS 和 JavaScript 是三项必备的基础技能。而如何事半功倍地掌握好这些知识？通过了解当下火热的开源项目不乏为最佳学习姿势。本文盘点国内评分最高且收藏量超过 100 的前端技术开源项目，希望可以帮助更多的开发者扩展学习。 1.极简模块化前端UI框架 Layui 评分：9.3；…
网页保存为图片及高清截图的优化 | canvas跨域图片配置本次技术调研来源于H5项目中的一个重要功能需求：实现微信长按网页保存为截图。这里有个栗子（请用微信打开，长按图片即可保存）：3分钟探索你的知识边界将整个网页保存为图片是一个十分有趣的功能，常见于H5活…
Redux 关系图解Redux是一款状态管理库，并且提供了react-redux库来与React亲密配合，但是总是傻傻分不清楚这2者提供的API和相应的关系。这篇文章就来理一理。 Redux Redux 三大核心 Redux的核心由三部分组成：Store, Action, R…
tabris.js+restify+码云打造个人APP
将 Node.js 内置于手机原生应用——以后 Android 和 iOS 可以用 npm 包了？ Earlier this year we published a demo app showcasing our port of Node.js with ChakraCore to iOS. In the accompanying blog article,
JavaScript：到底什么是ES6、ES8、ES 2017、ECMAScript? 学习 JavaScript 和 ECMAScript 历史和它们命名的由来! 学习 JavaScript 过程中可能会有一些疑惑。特别是一些缩写，一些缩写的组合；我们就来彻底解释下这些名词。什么是 ECMAScript? 这发生在很久很久以前： JavaScript 原本命名这个名字是因为想借助 Java 的成功，以在业界能够站住脚。 Netscape 公司…
写给前端应届生的职业规划建议林洋，YMFE 资深前端工程师，负责去哪儿网 Hybrid（Hy）、React Native（QRN）等移动端方案架构、开发和推进，负责一系列基于 Node 的开源平台（YIcon、YApi 等）、开发工具（小程序构建工具、YDoc、YKit 等）的管理维护工作。专注于移动前端，着眼于工程流程化。【前言】近一年多的时间，笔者在…
微前端：将微服务理念延伸到前端开发中翻译自 https://micro-frontends.org/ 本文描述了采用不同 JavaScript 技术框架的多个团队中协同构建一个现代化前端 Web 应用所需要的技术、策略和方法。什么是微前端？微前端这个术语最初来自 2016 年的 ThoughtWorks 技术雷达[ https://www.thoughtworks.com/radar/techniques/micr…
晚晴幽草说之-前端札记坦白来说，写博文这事儿，是一项费力且耗时的工作；如果再加上行文、配图方面的考究润色，就更为不易。但平时，偶有些新的见闻和想法什么的，值得分享讨论；兴致踏来时，则会分享至 HacPai 、 V2ex 抑或是微博；而这些分享内容不多，不成整体，难以成篇，故此也很分散；而且受众也飘忽不定，反馈稀薄。这篇文字的存在，…
Vue 2.5发布在即将全面支持TypeScript 原文链接 Upcoming TypeScript Changes in Vue 2.5 如无特殊声明，文中的TS均指 TypeScript 由于是本人第一次翻译，且无TypeScript使用经验，如果有错误之处，请阁下不吝赐教。类型优化从Vue 2.0发布以来，就一直有呼声说要将TypeScript更好地和Vue整合到一起，主要的库（Vue,…
web前端编码规范整合决定综合网上的规范整出一套自己的开发规范出来，以后代码的风格均按照要求来编排，方便管理维护一、命名规范项目命名：全部采用小写方式，以下划线分隔，例：my_project_name 目录命名：参照项目命名规则；…
《深入理解 ES6》阅读笔记：用模块封装代码不知不觉《深入理解ES6》阅读笔记就写到了最后一篇，完结之后可能会开启另外的一个系列，分享自己的知识点，让阅读到的人有一点点的收获，以及自己的成长。最后一篇主要是来写一写用模块封装代码的事情，回顾历史，从最早的立即执行函数，再到require.js，以及commonjs，今天我们面对的是语言标准给我们带来的模块化方案…
给 String 实现一个安全的 subscript 方法完整的实现：Gist 最近刚好接触了字符串的切片，原生的 API 各种麻烦，我就试着实现了几个语法糖，目标是： let str = “Swift-Evolution” str // “ft-Evolution” str // “Swif” str // “Swi” str // “ft-Evolut” Swift 4 的字符串原生也是带subscript方法的，…
TinyMCE 4.7.0 发布，JavaScript 富文本编辑器 TinyMCE 4.7.0 已发布，该版本带来了全新的专为移动设备设计的新 UI，以及更具现代风格的默认皮肤，以及对一些菜单和编辑功能进行了修正。 TinyMCE 是一款 JavaScript 富文本编辑器，包含40多种强大的编辑功能。更新内容： Added new mobile ui that is specifically designed for mobile devices. …
RequireJS require 路径问题 RequireJS 的引用路径真是个迷，看了这么久终于有了点思路，做出以下总结。首先需要了解两个基本概念，baseUrl 和 paths，最后会由这两个东西拼接路径。 baseUrl baseUrl 的确定很简单，三种情况 1. data-main 属性指定如果在引用 require.js 的 <script> 标签中指定了 data-main 属性，则 baseUr…
JS进阶篇–命名空间模式解析简介在SF上看到这样一个提问：如题，因为不得已的原因，需要写若干个全局函数。但又不想这样： {代码…} 题主问有什么好的写法？解答：如果你用 jQuery，你可以这样写 {代码…} 如果你不用 jQuery，可以直接实…
core-js —— JavaScript 的模块化标准库 core-js 是babel-polyfill 的底层依赖，通过各种奇技淫巧，用 ES3 实现了大部分的 ES2017 原生标准库，同时还要严格遵循规范。示例： Array.from(new Set( )); // => ‘*’.repeat(10); // => ‘**********…
Web网站压力及性能测试在项目上线之前，都需要做压力测试，目的是看下我们的网站能抗住多少的压力，能承担多少并发，如果不做压力测试，一旦出现大访问量时，我们的网站会挂掉。一、Webbench测试并发 Webbench是Linux下的一个网站压力…
Node.js基金会官方的开发者认证准备就绪 Node.js基金会正在为新的Node.js开发者认证（Developer Certification）做最后的准备工作，该认证计划于十二月推出。新推出的认证可能将采用一种不同于开发人员习以为常的方式。InfoQ采访了Node.js基金会教育社区经理Tracy Hinds。他声称这一认证考试的目标很现实：我们希望它真实地体现了人们的正常编程方式，因…
deeplearn.js 发布 0.3.0 版，增添对 iOS 的支持 API additions API additions
TypeOrm：可运行在 NodeJS, Browser, Cordova 等平台的 Orm 框架 TypeORM is an ORM that can run in NodeJS, Browser, Cordova, PhoneGap and Ionic platforms and can be used with TypeScript and JavaS
gulp源码解析之任务管理提到前端工程的自动化构建，gulp是其中很重要的一个工具，gulp是一种基于stream的前端构建工具，相比于grunt使用临时文件的策略，会有较大的速度优势。本文会对gulp的主要部分进行详细剖析，期待本文能够帮助读者更好地在工程中实践gulp。 gulp等前端构建脚本并不是一种全新的思想，早在几十年前，gnu make已经在各种…
JavaScript 浮点数陷阱及解法众所周知，JavaScript 浮点数运算时经常遇到会0.000000001和0.999999999这样奇怪的结果，如0.1+0.2=0.30000000000000004、1-0.9=0.09999999999999998，很多人知道这是浮点数误差问题，但具体就说不清楚了。本文帮你理清这背后的原理以及解决方案，还会向你解释JS中的大数危机和四则运算中会遇到的坑。浮点数的存…
webpack 应用编译优化之路作者：苗典目前大家使用最多也是最广泛的应用打包工具就是 webpack 了，除去 webpack 本身已经提供的优化能力（例如，Tree Shaking、Code Splitting 等）之外，我们还能做哪些事情呢，本篇主要就为大家介绍下滴滴 WebApp 作者：苗典目前大家使用最多也是最广泛的应用打包工具就是 webpack 了，除去 webpack 本身已经提供的优化能力（例如，Tree Shaking、Code Splitting 等）之外，我们还能做哪些事情呢，本篇主要就为大家介绍下滴滴 WebApp
Redux入门教程（快速上手）典型的Web应用程序通常由共享数据的多个UI组件组成。通常，多个组件的任务是负责展示同一对象的不同属性。这个对象表示可随时更改的状态。在多个组件之间保持状态的一致性会是一场噩梦，特别是如果有多个通道用于…
前端：影子杀手篇前言对于一个影子杀手而言，总能杀人于无形。前端也有影子杀手，它总是防不胜防地危害着你的网站本篇打算介绍一些前端的影子杀手们——XSS和CSRF。或许，你对它恨之入骨；又或者，你运用的得心应手。恨之入骨，可能是因为你的网站被它搞得苦不堪言；得心应手，可能是因为你从事这项工作，每天都在和…
Nodejs 通过 fs.createWriteStream 保存文件工作中难免会遇到处理大文件的时候，有这种stream的处理方式，就不需要一次处理太大的文件，从而导致内存不够用，或者内存占用太多。 fs.createWriteStream 似乎不会自己创建不存在的文件夹，所以在使用之前需要注意，保存文件的文件夹一定要提前创建。 const path = ‘/xxxxxx/ddd/’; if (!fs.existsSync(path)…
Node.js 内容管理框架 DoraCMS v2.0.0 版本更新 DoraCMS 近期修复了一些重要bug，也做了一系列的优化，主要细节如下：生产环境日志目录可配置，修复用户部署生产报路径找不到的问题新增广告管理模块，修复多图轮播显示不正常的问题修复删除文章没有同步删除关联留言的问题更新前端后台样式修复留言过滤特殊字符的问题添加了留…

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

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

关注我

我的微信公众号：前端开发博客，在后台回复以下关键字可以获取资源。

回复「小抄」，领取Vue、JavaScript 和 WebComponent 小抄 PDF
回复「Vue脑图」获取 Vue 相关脑图
回复「思维图」获取 JavaScript 相关思维图
回复「简历」获取简历制作建议
回复「简历模板」获取精选的简历模板
回复「加群」进入500人前端精英群
回复「电子书」下载我整理的大量前端资源，含面试、Vue实战项目、CSS和JavaScript电子书等。
回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识，加我微信:caibaojian89 交流