20181026 前端开发日报

在vue项目中优雅的使用Svg;Node.js 11 发布,Node 10正式进入LTS;前端相关资源汇总;基于Vue2的简易的省市区县三级联动组件;Node.js 服务连接 MongoDB 处理最佳实践;分享一个高性能灵活的多页面Vue脚手架;封装一个js获取window系统或者手机系统版本的方法;在 JavaScript 和 WebAssembly 之间调用执行速度终于快了

  1. 在vue项目中优雅的使用Svg github demo: github地址 闲聊背景 本文主要以 vue-cli3 搭建的项目为例,来聊一下如何在项目中更优雅的使用 svg 。 众所周知, vue-cli3 已经推出很长一段时间了,大家可以感受一下 vue-cli3 带来的零配置体验。But,也相应带来了一些弊端,就是如归需要修改默认的 loader 时,会比较麻烦。 好了,上正题…
  2. Node.js 11 发布,Node 10正式进入LTS 作者|覃云 今天,Node 基金会正式发布 Node.js 11,同时宣布,到 10 月 30 日,Node.js 10.x 将成为 LTS(Long Term Support)版本,也就是长期支持版本。 Node官方建议如果你是在工作中使用
  3. 前端相关资源汇总 简介 前端发展迅速,开发者富有的创造力不断的给前端生态注入新生命,各种库/框架/工程化构建工具层出不穷,眼花缭乱,不盲目追求前沿技术,学习框架和库在满足自己开发需求的基础上,然后最好可以对源码进行调研,了解和深入实现原理,从中可以获得更多的收获 随着前端发展,前端的职责也跟着变化,不再仅…
  4. 基于Vue2的简易的省市区县三级联动组件 这是一个基于Vue2的简易省市区县三级联动组件,可以控制只显示省级或只显示省市两级,可设置默认值等。提供原始省市县代码和名称数据,适用于各种有关城市区县的应用。 查看演示 安装 我们使用npm安装: npm install v-distpicker –save 使用 首先在模板中加入组件: <v-distp…
  5. Node.js 服务连接 MongoDB 处理最佳实践 关于如何处理 node.js 服务连接 MongoDB,我查阅了大量中英文资料,发现并没有太适合我所期望的能力的方案,因此经过一番官方文档的研究,总结了以下的连接 MongoDB 的方法(使用目前 Node.js 平台最常用的 MongoDB ODM mong
  6. 分享一个高性能灵活的多页面Vue脚手架 最近搭了个脚手架,主要特点是: 自由控制开发哪个项目,可单页可多页 可自由配置外部cdn 可上传至七牛或阿里的存储空间 性能高,灵活。 遂推荐一波,希望能帮助到有需要的小伙伴。 github:高性能灵活的多页面Vue脚手架 高性能灵活的多页面Vue脚手架
  7. 封装一个js获取window系统或者手机系统版本的方法 前言 今天1024程序员的节日,祝广大程序猿朋友节日快乐!最近比较忙,疏于总结。博客很久没有详细好好的写文章了。今天这篇文章也是平时用到的。就是一个积累函数吧。后面有时间好好总结一下。 通过navigator navigator可以获取很多信息,我前面也有文章提及过, https://www.haorooms.com/post/js_navigator_…
  8. Google JavaScript 代码风格指南 Google 和 Airbnb 是目前最流行的 JavaScript 代码风格,如果你长期使用 JavaScript 来写代码的话,建议对比看看。 以下是我认为在 Google 代码风格指南中最有意思的十三条规则,和大家分享一下: 使用空格,而不是 tab
  9. 不一样的 JavaScript js语法看起来是类c的,如果有c语言基础,可以看懂一些js代码,尤其是类似这样的代码: for (i = 0; i < 10; i++) { // code } 只看这段代码,跟c的写法甚至完全一样。很容易让你有种错觉,简单看下js语法,就能写出优秀的js代码。 但是,不要被骗了,当你看到后面的代码时,就不会再这样想了。下…
  10. CSS单位em是相对于父元素还是当前元素的字体大小?<div>会被padding-bottom撑开,而padding-bottom的高度是64px,而不是32px!这证明了1em等于当前元素的字体大小(只有一个例外,下面会讲)。
  11. 前端与人工智能 文/Yoha 来自蚂蚁金服人工智能部 邮箱: yaohua.cyh@antfin.com 好吧,我承认这个标题有点太大了,其实我更想要说的是“在人工智能时代、在人工智能公司、在人工智能部门,我们前端er的角色到底是怎样的”。 众(ge)所(ren)周(yi
  12. TypeScript基础入门之Javascript文件类型检查(三) 继续上篇文章【 TypeScript基础入门之Javascript文件类型检查(二) 】 支持JSDoc 下面的列表概述了使用JSDoc注释在JavaScript文件中提供类型信息时当前支持的构造。 请注意,尚不支持下面未明确列出的任何标记(例如 @async )。 @type @param  (or  @arg…
  13. JavaScript 终极指南之执行上下文、变量提升、作用域和闭包 视频: The Ultimate Guide to Execution Contexts, Hoisting, Scopes, and Closures in JavaScript 我认为理解 JavaScript 语言的最重要的基本概念是理解执行上下文(Execution Context),这点可能令人感到意外。正确的学习执行上下文,可以让你更容易学习更高级的内容,比如变量提升(hoisting)、作用域链(scope…
  14. 深入浅出的webpack4构建工具—比mock模拟数据更简单的方式(二十一)
  15. Vue-SSR: head Mixin 实现头部信息管理 上周发了我第一篇技术博客,传送门1:JS中的数组过滤,从简单筛选到多条件筛选,感谢大家的支持,尤其是提出疑问,发现错误的同学,感谢你们。发完博客以后,我用 hexo 搭了一个 github pages, 绑定了我之前买的域名,传送门2: blog.yidol.
  16. 浅谈 TypeScript:immutable 在我们最基础的印象里 JavaScript 的对象都是引用关系,这对于我们的应用来说,可能会有无法预期的结果,比如: const f = { a: 1 } function g(r) { r.a = 2 } g(f) console.log(f.a) // 2 这影响了外部定义的对象,有时候我们不可预知的错误,就是如此。那么,是否有更好的解决方案…
  17. 利用 HTTP Security Headers 提升站点安全性 产品不断迭代,安全却很少关注,这在小团队司空见惯吗? 前两天拿到一份站点的安全检测报告: 例举几点: 你是否将 Mysql、Redis、Mongo 等端口暴露在公网? 你是否采用 22、3306这种极易被扫描的默认端口? 你是否强制使用…
  18. 如何理解 Web 3? 前言:本文清晰地阐述了 Web 3到底是什么,它有哪几个关键趋势?它有什么值得努力的愿景?但本文也清晰地阐述了要达到Web 3的愿景,还有很多需要克服的障碍,比如去中心化应用的用户体验,扩展性,成本,治理,监管,需求规模等,问题重重,但这不妨碍它是一个值得前进的方向。Web 3技术中很重要的是区块链和加密技术,…
  19. 体验WebAssembly 原文地址: github.com/yinxin630/b… 技术交流: fiora.suisuijiang.com/ WebAssembly是什么 WebAssembly是一种运行在现代网络浏览器中的新型代码并且提供新的性能特性和效果。它设计的目的不是为了手
  20. 半小时轻松玩转WebGL滤镜技术系列(一) 腾讯DeepOcean原创文章:dopro.io/webgl-filte… 滤镜技术一直在我们的生活中有着广泛的应用,不管是各式各样的美图软件,还是最近大热的短视频app,其中都将滤镜效果作为产品的重要卖点,有些甚至成为了产品的标志,比如本文的封面是不是让你
  21. 前端解读控制反转(IOC) 前言 随着前端承担的职责越来越重,前端应用向着复杂化、规模化的方向发展。大型项目模块化是一种趋势,不可避免模块之间要相互依赖,此外还有很多第三方包。这样的话如何去管理这些繁杂的文件,是一个不可避免的话题。此时作为一种已经被实践证明过的思想模式一直得到大家的青睐
  22. 开源了一个 JavaScript 版敏感词过滤库 最近在做一个项目,寻遍了 Node 开源社区居然没有发现一个好用的敏感词过滤库,有那么几个库外观上看起来似乎还不错,用起来却一塌糊涂,震惊有余,失望至极。于是花了一天时间自己撸了一个库,库名叫 fastscan,这是我的第一个 Node 开源项目,它也可以用于
  23. 好嗨详细的vuex源码分析之API 是如何实现 源自:blog.csdn.net/sinat_17775… Vuex API 分析 Vuex 常见的 API 如 dispatch、commit 、subscribe 我们前面已经介绍过了,这里就不再赘述了,下面介绍的一些 Store 的 API,虽然不常用,
  24. 发布一个react组件——react-read-pdf,用于在移动端展示PDF文件 PC端的浏览器对于PDF文件的展示没有太大的问题,给定一个PDF的链接,就可以用浏览器默认的展示样式来展示和渲染PDF文件的内容。比如一个"www.baidu.com/test/pdf"。 如何在移动端展示这个文件。为了在移动端展示和渲染PDF文件的内容,本文
  25. gRPC-Web发布,REST又要被干掉了? 作者|Luc Perkins 译者|无明 今天,云原生计算基金会(CNCF)正式发布 GA 版本的 gRPC-Web,这是一个 JavaScript 客户端库,使 Web 应用程序能够直接与后端 gRPC 服务通信,不需要 HTTP 服务
  26. HTTP/2 协议详解 作者保留所有权利。All rights reserved. 关于作者 目录 HTTP/1.x简介 回顾HTTP/1.x的请求流程 HTTP/2简介 二进制分帧 流 头部压缩 约定的错误 …
  27. 实现一个简单版本的vue及源码解析(二) 响应式系统及实现 响应式原理 Vue.js的响应式原理依赖于Object.defineProperty,尤大大在Vue.js文档中就已经提到过,这也是Vue.js不支持IE8 以及更低版本浏览器的原因。Vue通过设定对象属性的 setter/getter 方法
  28. 如何在前端中使用protobuf(vue篇) 前言 由于目前公司采用了ProtoBuf做前后端数据交互,进公司以来一直用的是公司大神写好的基础库,完全不了解底层是如何解析的,一旦报错只能求人,作为一只还算有钻研精神的猿,应该去了解一下底层的实现,在这里记录一下学习过程。 Protobuf简单介绍 Goo
  29. 高级 Vue 组件模式 3 03 使用 mixin 来增强 Vue 组件 目标 之前一篇文章中,我们虽然将 toggle 组件划分为了 toggle-button、toggle-on 和 toggle-off 三个子组件,且一切运行良好,但是这里面其实是存在一些问题的: toggle

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

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


关注我

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

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

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