20180802 前端开发日报

你真的了解前端路由吗?;前端技术周刊 2018-07-30:Three.js;前端也需要好好的精进自己的算法;JS简单实现防抖和节流;JavaScript 代码格式化;马蜂窝的前端火了遇到冲突不怕怼,强制提交就是干;Express, Koa, Redux中间件的区别,写法和执行流程;TypeScript 3.0重磅发布,新特性详解

  1. 你真的了解前端路由吗? 前言:网络上,很多介绍前端路由实现的文章,以及路由原理的文章。但是最近在面试过程中,我发现,所有面试者都能讲清楚路由的技术实现,但是却对每一种技术实现的适用场景不理解。比如hash路由,很多人的回答是hash路由会带有一个#号不好看,所以用了history路由
  2. 前端技术周刊 2018-07-30:Three.jsIonic 4.0.0 beta 版发布,新版本变化颇多,主要是采用了很多现代 Web 的 API,比如:Custom Elements,CSS Variables 和 Shadow DOM 等。 点评:最早由 Google 提出的 Web Components V0 系列规范几乎全军覆没…
  3. 前端也需要好好的精进自己的算法前端发展的再快,也不要忘记精进自己的算法,算法是灵魂和核心。我会把我刷过的算法题总结归类,不断完善。欢迎大家关注。
  4. JS简单实现防抖和节流 Ps: 比如搜索框,用户在输入的时候使用 change 事件去调用搜索,如果用户每一次输入都去搜索的话,那得消耗多大的服务器资源,即使你的服务器资源很强大,也不带这么玩的。 1. 防抖 – debounce 其中一种解决方案就是每次用户停止输入后,延迟超过 500ms 时,才去搜索此时的 String ,这就是防抖。 …
  5. JavaScript 代码格式化 关于代码格式化,有3个相关的概念,比较容易混淆 代码格式:人工自定义的、或者遵循某种通用规范 例如 JavaScript Standard Style , Airbnb JavaScript Style , Google JavaScript Style 等) 代码检查:依据一种 指定的代码格式,用提示出不符合格式的代码(ESLint、 TSLint …
  6. 马蜂窝的前端火了遇到冲突不怕怼,强制提交就是干相信大家都在世界杯期间有意无意地看到过马蜂窝的洗脑广告,短短的15秒,品牌名就出现了6次。“旅游之前,为什么要先上马蜂窝”,这些不断重复的广告词让人犹如魔咒般印象深刻。
  7. Express, Koa, Redux中间件的区别,写法和执行流程 Express 是一个自身功能极简,完全是由路由和中间件构成一个的 web 开发框架:从本质上来说,一个 Express 应用就是在调用各种中间件。 中间件(Middleware) 是一个函数,它可以访问请求对象(request object ( req )), 响应对象(response object ( res )), 和 web 应用中处于请求-响应循环流程中的中间件,一般…
  8. TypeScript 3.0重磅发布,新特性详解 作者|Daniel Rosenwasser 译者|无明 编辑|覃云 今天,微软正式发布 TypeScript 3.0,这是 TypeScript 之旅的一个新的里程碑! 3.0 虽然是个大版本,但并没有包含太多重大的突破性变更(
  9. 基于HTML5 的互联网+地铁行业新模式近几年,互联网与交通运输的融合,改变了交易模式,影响着运输组织和经营方式,改变了运输主体的市场结构、模糊了运营与非营运的界限,也更好的实现了交通资源的集约共享,同时使得更多依靠外力和企业推动交通信…
  10. 基于webpack4搭建vue2、vuex多页应用 最近在对公司的H5项目做重构,涉及到构建优化,由于一些历史原因,项目原先使用的打包工具是饿了么团队开发的 cooking(基于 webpack 做的封装,目前已停止维护了。)如果继续使用,一是项目目前已经比较复杂,现在的构建方式每次打包耗时较长;二是使用一个已经停止维护的工具本身也有风险;另外因为本次重构还要进行 v…
  11. vue2.x源码解析系列二: Vue组件初始化过程概要 笔名 言川 , 前端工程师,精通 Vue/Webpack/Git 等,熟悉 Node/React 等,涉猎广泛,对算法/后端/人工智能/linux等都有一定研究。开源爱好者,github上目前总计 5000+ Star 。 我的github主页:https://github.com/lihongxun945 我的博客地址:https://github.com/lihongxun945/myblog 我的掘金主页:https…
  12. 深度解析 Vue 响应式原理 该文章内容节选自团队的开源项目 InterviewMap。项目目前内容包含了 JS、网络、浏览器相关、性能优化、安全、框架、Git、数据结构、算法等内容,无论是基础还是进阶,亦或是源码解读,你都能在本图谱中得到满意的答案,希望这个面试图谱能够帮助到大家更好的准
  13. Three.js 开发总结 说明:本文档基于最新版的Three.js(r94),由于以前从来没有写过JavaScript和HTML,所以有不足之处还望见谅。 1.准备 1.1.官网 https://threejs.org/ 1.2.源码及示例 https://github.com/mrdoob/three.js/ 2.HelloWorld var camera, scene, controls, renderer; init(); animate()…
  14. 带你一起撸一遍 nodejs 常用核心模块(三) zlib 可以用来实现对 HTTP 中定义的 gzip 和 deflate 内容编码机制的支持。 HTTP 的 Accept-Encoding 头字段用来标记客户端接受的压缩编码。 使用 zlib 编码成本会很高, 结果应该被缓存。(下面的演示代码只演示压缩) //compresss方法实现压缩 compress(req, res, statObj, realPat) { //实现压缩功能 let en…
  15. Vue项目全局配置页面缓存,实现按需读取缓存 一个web app的实际使用场景中,有一些情景的交互要求,是记录用户的浏览状态的。最常见的就是在列表页进入详情页之后,再返回到列表页,用户希望返回到进入详情页之前的状态继续操作。但是有些使用场景,用户又是希望能够获取最新的数据,例如同级列表页之间切换的时候。 如此,针对上述两种使用场景,需要实现按需读…
  16. 2018年值得关注的10大JavaScript动画库现代网站的客户端依靠高质量的动画,这就使得JavaScript动画库的需求不断增加。幸运的是,供应似乎与需求相匹配,并且有多种选择。至于选择哪一个就难以定夺了。在这一年里,许多动画库有可能完善得更好,为创建…
  17. 原生 JavaScript 实现 state 状态管理系统 Build a state management system with vanilla JavaScript | CSS-Tricks 在软件工程中,状态管理已经不是什么新鲜概念,但是在 JavaScript 语言中比较流行的框架都在使用相关概念。传统意
  18. 使用 CSS 和 jQuery 制作文字马赛克效果 需求 一段文本中,给指定的文字打上马赛克,然后付费阅读 解决方法 方法一:使用 CSS 模糊文字 span.mosaic { color: transparent; text-shadow: 0 0 10px r
  19. Vue父子组件如何双向绑定传值 父子组件之间的双向绑定非常简单,但是很多人因为是从Vue 2+开始使用的,可能不知道如何双向绑定,当然最简单的双向绑定(单文件中)就是表单元素的 v-model 了,例如 <input type="text" /> 它会响应表单元素的 value 属性,当输入框文本改变时,会将 value 值传给 v-model 所绑定的变…
  20. 前端每日实战:95# 视频演示如何用纯 CSS 和 D3 创作一只扭动的蠕虫效果预览 按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。 [链接] 可交互视频 此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 请用 chrome, safari, edge 打开观看。 [链接] …
  21. Ajax学习与理解响应的第四部分是字符串,可以用 JSON 语法表示一个对象,也可以用 JSON 语法表示一个数组,还可以用 XML 语法,还可以用 HTML 语法,还可以用 CSS 语法,还可以用 JS 语法,还可以用我自创的语法
  22. Redux 运作流程分析与实现 概述 随着应用程序单页面需求的越来越复杂,应用状态的管理也变得越来越混乱,而Redux的就是为解决这一问题而出现的。在一个大型的应用程序中,应用的状态不仅包括从服务器获取的数据,还包括本地创建的数据,以及反应本地UI状态的数据,而Redux正是为解决这一复杂问题而存在的。 redux作为一种单向数据流的…
  23. Form & AJAX & Fetch
  24. Vue2.x源码解析系列四:数据响应之Observer 笔名 言川 , 前端工程师,精通 Vue/Webpack/Git 等,熟悉 Node/React 等,涉猎广泛,对算法/后端/人工智能/linux等都有一定研究。开源爱好者,github上目前总计 5000+ Star 。 我的github主页:https://github.com/lihongxun945 我的博客地址:https://github.com/lihongxun945/myblog 我的掘金主页:https…
  25. vue2.x源码理解了解下Flow,Flow 是 facebook 出品的 JavaScript 静态类型检查工具。Vue.js 的源码利用了 Flow 做了静态类型检查
  26. Vue2.x源码解析系列三:Options配置的处理 笔名 言川 , 前端工程师,精通 Vue/Webpack/Git 等,熟悉 Node/React 等,涉猎广泛,对算法/后端/人工智能/linux等都有一定研究。开源爱好者,github上目前总计 5000+ Star 。 我的github主页:https://github.com/lihongxun945 我的博客地址:https://github.com/lihongxun945/myblog 我的掘金主页:https…
  27. 前端每日实战:94# 视频演示如何用纯 CSS 创作一台拍立得照相机效果预览 按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。 [链接] 可交互视频 此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 请用 chrome, safari, edge 打开观看。 [链接] …
  28. 我的前端面试题前阵子去湖南帮忙面试,话说还是第一次正经面试别人,问题是老早以前就开始想了,在这里整理一下,答案只是简要,也不一定完全正确,如有错误,劳烦指点
  29. CSS性能优化的8个技巧 本文作者:高峰,360奇舞团前端工程师,W3C性能工作组成员,同时参与WOT工作组的学习。 我们都知道对于网站来说,性能至关重要,CSS作为页面渲染和内容展现的重要环节,影响着用户对整个网站的第一体验。因此,与其相关的性能优化是不容忽视的。 对于性能优化我们
  30. JS之父和JSON之父:JavaScript的下一站 作者|Dylan Schiemann 译者|覃云 7 月 11 日,FullStack 2018 在伦敦举行,JavaScript 之父 Brendan Eich 和 JSON 之父、“JavaScript:The Good Parts”的作者

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

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


关注我

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

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

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