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

vue腾讯地图的引入；2017 年 6 月前端开发者干货大合集；使用flv.js做直播；canvas 鼠标点击出现烟花效果；一份笔试题：前端开发人员需要具备的能力；react 15.5+ 使用CSSTransitionGroup实现路由过渡动画；介绍一项让 React 可以与 Vue 抗衡的技术；简编漫画介绍 WebAssembly

vue腾讯地图的引入1.通过经纬度查地理名称应用腾讯地图js 获取地理名称 {代码…} 2.直接调用腾讯地图组件 3.通过地…
2017 年 6 月前端开发者干货大合集每个月的前端开发者干货素材大合集，相对而言更加专注于为网页设计师和前端开发者搜集相关的工具和素材，这次的大合集当中包含一款颇为有趣的屏幕录像软件，几款适用范围较广的基于 Material Design 的框架，还有一些性能测试库也非常好用。这些前端工具与素材功能各不相同，总会有一两款是你感兴趣，甚至正好想要的~ ——…
使用flv.js做直播在介绍flv.js之前先介绍下常见的直播协议以及给出我对它们的延迟与性能所做的测试得出的数据。常见直播协议 RTMP: 底层基于TCP，在浏览器端依赖Flash。 HTTP-FLV: 基于HTTP流式IO传输FLV，依赖浏览器支持播放FLV…
canvas 鼠标点击出现烟花效果主要想法：鼠标点击事件触发圆点出现在鼠标处圆点大小，颜色，数量随机有一个小白圈做为轨迹,不断改变半径变大变淡消失圆点向外移动，自身变小，消失。随着移动的距离远，移动速度跟着变需要处理的是，从鼠…
一份笔试题：前端开发人员需要具备的能力本文根据一份笔试题对前端学习进行延伸 —— 由ZhiTaoDai分享
react 15.5+ 使用CSSTransitionGroup实现路由过渡动画在做react项目过程中，有时候想实现app的那种上下左右切换路由的特效，但是一直没有找到合适的教程，要么说的不清楚，没有demo，要么就是版本太老，过时了，要抓狂啦。根据网上搜到的资料，以前实现react动画有…
介绍一项让 React 可以与 Vue 抗衡的技术好吧，我承认我是标题党。React 明明如日中天，把它与 Vue 倒过来，给 Vue 加点东西或可与 React 抗衡。不过，这两年 Vue 干的正是这事，不断加东西，不断优化，按它现有发展速度超越 React 或在情理之中。如果我…
简编漫画介绍 WebAssembly 翻译自火狐工程师的介绍 WebAssembly 性能之所以快原由的文章地址: https://www.smashingmagazine.com/2017/05/abridged-cartoon-introduction-webassembly/# —— 由小刀c分享
webpack 与 SPA 实践之管理 CSS 等资源
JavaScript 中 Blob 对象一个 Blob 对象表示一个不可变的, 原始数据的类似文件对象。Blob 表示的数据不一定是一个 JavaScript 原生格式。 File 接口基于 Blob，继承 blob 功能并将其扩展为支持用户系统上的文件。 —— 由pingfan分享
vue总结条件渲染 v-if vs v-show v-show 要切换显示内容，初始化开销大 v-if 根据状态只显示某个内容，状态切换概率小，切换开销大使用key管理可复用的元素（比如切换登录方式，不同方式登录内容是一样的），速度快 {代…
Node.js 命令行工具检查更新的正确姿势本文首发于我的博客，转载请注明出处：https://kohpoll.github.io/blo… 随着 Node.js 的“走红”，使用 Node.js 开发命令行工具越来越简单。一个成熟的命令行工具应该从一开始就要考虑好之后的版本更新如何“优雅”…
vue.js+Echarts开发图表放大缩小功能最近使用echarts来开发某系统的图表功能，先申明我以前用的ext.js，ext.js对图表有自己的一套组件，用起来也很方便。但是由于ext.js过于臃肿，公司决定使用echarts来开发图表功能。当我们使用的时候才悲催的发现…
vue 组件 vue-tinymce 开发经验分享分享 tinymce 富文本编辑器封装成 vue 组件的经验 —— 由提灯人帕奇式分享
TypeScript 零基础入门
HTML5 postMessage 和 onmessage API 详细应用 Web Workers 为 Web 前端网页上的脚本提供了一种能在后台进程中运行的方法。一旦它被创建，Web Workers 就可以通过 postMessage 向任务池发送任务请求，执行完之后再通过 postMessage 返回消息给创建者指定的事件处理程序 (通过 onmessage 进行捕获)。Web Workers 进程能够在不影响用户界面的情况下处理任务，并且，它还…
【The Modern Javascript Tutorial】Modern JavaScript Tutorial: simple, but detailed explanations with examples and tasks, including: closures, document and events, object oriented programming and more.
由重构进阶前端开发入门 (一) DOM 操作虽然前端的技术每年都在不断更新，但新人们都还是从基础的 HTML、CSS 样式开始学 Web 前端开发的。这样切图、使用 HTML + CSS 编写网页的工作过程，我们一般称之为网页重构，关于网页重构和前端开发是否应该分离也一直存在争议。但就日常工作的情况来看，二者还是很难彻底分开的，前端开发写脚本时必定需要网页重构…
react、react-router、redux 也许是最佳小实践1小前言这是一个小小的有关react的小例子，希望通过一个小例子，可以让新手更好的了解到react、react-router4.0、redux的集中使用方法。这是基于create-react-app来开发的，一种简单的快速创建 React web 项目的…
Vue 全家实战网易云音乐 (低仿 + 改造 MacOS 版) 通过网易云音乐 api 实现基础功能的云音乐 —— 由lichddd分享
小技巧之JSON.stringify()/parse()JSON JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于 ECMAScript (w3c制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构…
学习 JS 防抖【节流】学习 JS 防抖【节流】 —— 由草榴社区分享
[杂谈系列] 关于前端技术的选择吐槽至 2017 年，Javascript 从一门不受人关注的脚本语言到世界上最流行的编程的语言，得益于 Web 技术的蓬勃发展，互联网给人们的生活带来的极大的改变。近年来，各种框架层出不穷，无数创业公司追赶新潮，React, Angular, Vue，Express，Koa… 然而，却一个接一个的倒下了。多年前火爆一时的 Nodejs，如今论坛人去楼空…
《Server-Sent Events 教程》服务器向浏览器推送信息，除了 WebSocket，还有一种方法：Server-Sent Events（以下简称 SSE）。本文介绍它的用法。（by 阮一峰）
#前端头条#【用9种办法解决 JS 闭包经典面试题之 for 循环取 i】正确的说,应该是指一个闭包域,每当声明了一个函数,它就产生了一个闭包域(可以解释为每个函数都有自己的函数栈),每个闭包域(Function 对象)都有一个 function s…请戳→ #前端开发博客#
手把手教你怎么拆分 vuex@2.x 手把手第二弹，专治文档各种一笔带过，还小白一片天空～想要接触 vuex 但又无从下手的同学，赶紧收了。 —— 由木子七分享
NodeJs 交互式命令行工具 Inquirer.js – 开箱指南 Inquirer.js 试图为 NodeJs 做一个可嵌入式的美观的命令行界面。 —— 由SherHoooo分享
理解 NodeJS 中基于事件驱动的架构原文地址：Understanding Node.js Event-Driven Architecture 原文作者：Samer Buna 译文出自：掘金翻译计划译者：刘德元薛定谔的猫校对者：bambooom zaraguo 理解 NodeJS 中基于
基于 HTML5 Canvas 实现弹出框用户鼠标移入时，有弹出框出现，这样的需求很常见。这在处理 HTML 元素实现时简单，但是如果是对 HTML5 Canvas 构成的图形进行处理，这种方法不再适用，因为 Canvas 使用的是另外一套机制，无论在 Canvas 上绘制多少图形，Canvas 都是一个整体。而图形本身实际都是 Canvas 的一部分，不可单独获取，所以也就无法直接给某…
向zepto.js学习如何手动(trigger)触发DOM事件前言前端在最近几年实在火爆异常，vue、react、angular各路框架层出不穷，咱们要是不知道个双向数据绑定，不晓得啥是虚拟DOM，也许就被鄙视了。火热的背后往往也是无尽的浮躁，学习这些先进流行的类库或者框架可…