20190716 前端开发日报

由 QuickJS 想到的;前端面试:JS基础知识梳理;ES6 模块化入门;Web技巧(14);常见核心前端面试问题与详细解答;常见的面试问题:【CSS】已知高度,写出三栏布局;JavaScript技巧分享——纯数字(带小数点)过滤;Web应用程序如何创建 PDF

  1. 由 QuickJS 想到的 前几天,一个叫 Fabrice Bellard 的大牛程序员发布了一个新的 JS 引擎:QuickJS,引起了业界轰动。QuickJS 的主要特点是小,嵌入式,完整支持 ES2019 语法,和其他小型嵌入式 JS 引擎比起来,速度也很快。 登上大牛的主页( https://bellard.org ),瞬间被惊呆了。原来之前耳熟能详的 FFMPEG、QEMU 都是出自他之手。…
  2. ES6 模块化入门在 ES6 之前,我们已经知道了 RequireJS,AngularJS 的依赖注入,以及 CommonJS,具体可以看笔者的上一篇文章《JS模块化历史简介》。当我们学习 ES6 的模块化,就会发现它的发展深受 CommonJS 的影响。通过这篇文…
  3. Web技巧(14) 前段时间在微信群聊了一个动效的话题: 鼠标悬浮的时候,三个区块依次显示;鼠标移开时,三个区块反向依次消失。如果使用CSS的 triansition 是否可以实现? 借此话题,在这一期中就围绕着Web的动效来展开。Web动效不管是从设计到实现都有很多的话题可聊,比如,动画的设计、交互、实现等等。甚至是实现的技…
  4. 常见核心前端面试问题与详细解答本文总结了前端老司机经常问题的一些问题并结合个人总结给出了比较详尽的答案。关于知识点原理和详细,参考讲堂的视频教程:前端增长-重新定义大前端课程知识在不断更新,本片内容也逐步更新官方博客:FED123前端…
  5. 常见的面试问题:【CSS】已知高度,写出三栏布局(1)每个解决方案的优缺点(2)他们之间的比较,假设高度去掉,那种方法还能适用或者不适用(3)解决方案的兼容性,哪个更适用在实际项目中
  6. JavaScript技巧分享——纯数字(带小数点)过滤在编写输入金额的输入组件input时,虽然能够设置type为number,但却不能够自动检验用户输入的值是否符合金额的格式。比如,用户能够同时输入两个小数点。本文章以此为大前提展开略浅的技巧。
  7. Web应用程序如何创建 PDF在一些场景下,用户都要求一些需要的数据能以 pdf 的格式下载下来。如电子商务商店,经常需要一些报表数据来分析当月的销售情况。
  8. 使用vue.js的动态组件模板先来一篇翻译的文章,和我在项目中使用的动态组件思路一样,不过缺少了演化的过程,直接给出了最终的解决方案。这篇文章给的场景也很简单,但要了解这种思想是足够的。之后再详细的总结我遇到的问题和解决方案,…
  9. 使用 PhantomJS-node 生成截图 在 Node Server 里截取网页生成图片 使用 phantomjs-node 可以方便的实现上面的功能 安装 $ npm install phantom –save 使用 const phantom = require(‘phantom’); (async function() { const instance = await phantom.create(); const page = await instance.createPage(); awa…
  10. 位运算在vue权限路由中的应用 Role-Based Access Control:使用角色描述用户和权限(operation+resource)之间的关系,用户和权限之间无需直接关联 RBAC 基本模型如图所示(图片来自有赞权限系统): 本质上,角色就是一组权限的集合。 VUE权限路由的实现方案 0x01 后端表结构: 在项目中需要进行权限控制的路由可…
  11. 解密Redux: 从源码开始Redux是当今比较流行的状态管理库,它不依赖于任何的框架,并且配合着react-redux的使用,Redux在很多公司的React项目中起到了举足轻重的作用。接下来笔者就从源码中探寻Redux是如何实现的。
  12. 理清 Vue 中的钩子函数 在开发一般的业务来说,不需要知道 Vue 中钩子函数过多的执行细节。但是如果你想写出足够稳健的代码,或者想开发一些通用库,那么就少不了要深入了解各种钩子的执行时机了。 组件生命周期 hook 在组件树中的调用时机 先直接看一个例子: import Vue from ‘vue’; Vue.component(‘Test’, { props: { name: Strin…
  13. 如何连接 React 和 Node,Express在本文中,我将引导你创建一个简单的 React 应用,以及一个简单的 Node/Express API,并将两者相互连接。
  14. 优化高性能JS代码的几个要点,以及背后的原理 作为一个前端开发人员,我一直难以理解学习计算基础知识的重要性,这是因为我难以想象这些知识会以何种方式应用到前端开发的工作上。 然而在csapp 优化程序性能 这一节,彻底的改变了我的想法,作者讲述了对于一个正确,良好编写的c语言程序,如何优化它的性能。 对一段相同功能的代码,优化后与优化前产生了巨大的差…
  15. CSS + SVG 实现霓虹灯效果 一、往事 几年前,我有幸出差到东莞,在市中心一个85元一晚的小旅馆里面,我很激动。我像个没见过世面的孩子,看着窗外闪亮的霓虹灯招牌,心情久久不能平复。那灯红酒绿的景色,像那神秘的漩涡,把我吸进去了。我舔了舔嘴唇,从门缝下拾起一张名片,拨打了一个从未打过的电话…… ———————–…
  16. JavaScript事件相关基础及事件委托 已知网页的 DOM 节点构成的是树状结构,称为 DOM 树。 而且又知当页面上的一个节点触发了事件时,接收到事件通知的不仅仅只有这个节点,而是沿着它所在的DOM树的一支从 Document 到这个节点本身的所有元素都可以接收到事件的通知,但是接收到通知也是有先后顺序的,事件流就描述了这一支DOM树中上的元素接收到事件通知…
  17. Spring Boot 整合 Web 容器 Spring是为简化Java开发而生的。与传统的如Sturts这样的框架相比,它采用最小侵入编程,让开发者更少的感知到它的存在。随着Spring越来越强大,Spring体系也越来越复杂。为了化解戴着镣铐跳舞的窘境,产生了SpringBoot。 SpringBoot的理念是约定大于配置。大家都这么用,有了规范,一切就容易多了。这就实现了…
  18. 从 ECMA 规范解析 JavaScript 默认的取值和赋值行为 如果你是一个经验丰富的 Vue 开发者,那么你一定知道 Vue 的响应式原理是通过拦截对象的 get 和 set 实现的 // src/core/observer/index.js Object.defineProperty(obj, key, { enumerable: true, configurable: true, get: function reactiveGetter () { //… }, set: function react…
  19. 经常被面试官问到的JavaScript数据类型知识你真的懂吗?之前面试了几个开发者,他们确实做过不少项目,能力也是不错的,但是发现js基础不扎实, 于是决定写一下这篇javascrip数据类型相关的基础文章,其实也不仅仅是因为面试了他们,之前自己在面试的时候,也曾经被虐过…
  20. 一步一步搭建前端监控系统:如何定位前端线上问题?摘要: 记录用户行为,排查线上BUG。 作者:一步一个脚印一个坑 原文:如何定位前端线上问题(如何排查前端生产问题) Fundebug经授权转载,版权归原作者所有。 一直以来,前端的线上问题很难定位,因为它发生于…
  21. js继承(构造函数原型拷贝) 借着学习红宝书的机会,结合阮大佬的继承三部曲从头到尾总结一下继承的笔记(前端入门小白,如果有问题还请大佬指正) 继承 个人总结:继承就是将一个父对象传给多个子对象使用的方式 我们首先假设有一个对象Cat,猫有一些属性比如名字,颜色,还有一个固定属性type 我们有很多猫,它们的名字,种类不同,但是type相…
  22. 如何从零开源一个React组件有没有遇到这样一种情况,你花了很大精力在业务项目中写了一个组件,你觉得这个组件很通用,除了当前的业务场景还应该有其他的应用场景,所以你想开源这个组件,但又不知道从何入手。这篇文章就来聊聊如何开源一…
  23. 白话js闭包 闭包是js的一个语言特性,谈起它首先要从作用域出发。 我们从最简单的角度来讲作用域: <script> var a = 1; function echoA(){ console.log(a); } echoA(); //1 function echoA_again(){ var a = 2; var b = 3; console.log(a); } eachA_a…
  24. 使用 Electron5.0 构建你的 React 项目 最近要使用 Electron 来构建 React 项目,突然发现之前的 Demo 已经不能正常运行了,有些感概技术发展的迅猛。 如果你还不了解Electron,可以看我之前的文章:初探 Electron – 理论篇,理论知识没有变。如果你想了解Electron5.0版本如何构建React项目,不妨继续看本文。 需要注意:网上流传的 1.0 …
  25. 生猛FFmpeg 开发者徒手撸了一个 JS 引擎 (给技术最前线加星标,每天看技术热点) 原创:技术最前线(id:TopITNews) 今天 Hacker News 首页有个热门消息,是大佬 Fabrice Bellard 在 7 月 9 日发布的新作品:QuickJS  JavaScript 引擎。 JS 引擎是执行 JavaScript 代码的程序或解…
  26. 移动端浏览器前端优化策略 移动端的特点:设备屏幕较小、新特性兼容性较好、支持一些较新的 HTML5 和 CSS3 特性、需要与 Native 应用交互等。但移动端可用计算资源和网络资源极为有限,所以要做好移动端上的优化往往需要做更多的事情。 网络加载类 首屏数据请求提前 首屏数据请求提前,避免在 JavaScript 加载完成后才去后端请求数据。通常数据…
  27. 简单的 HTTP 调用,为什么时延这么大? 1. 背景 最近项目测试遇到个奇怪的现象,在测试环境通过 Apache HttpClient 调用后端的 HTTP 服务,平均耗时居然接近 39.2ms。可能你乍一看觉得这不是很正常吗,有什么好奇怪的?其实不然,我再来说下一些基本信息,该后端的 HTTP 服务并没有什么业务逻辑,只是将一段字符串转成大写然后返回,字符串长度也仅…
  28. 基于webpack4的VUE多页脚手架链接 写在前面 为什么要自己手写一个脚手架? 如何去思考遇到的问题? 正文 链接 原文链接 github whale-vue ——写在前面 1、为什么要自己手写一个脚手架? 在写这个脚手架之前我也深深的问过自己,在我工作的项目…

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

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


关注我

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

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

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