跳到主要内容

· 阅读需 3 分钟
givebest

浏览器网页可以很方便的使用 postmessage 与 Chrome 扩展通讯,但是 postmessage 只能传递消息,不能传递 promise,如果遇到网页需要等待 Chrome 扩展返回的 promise,处理起来就比较麻烦了。

现在可以通过封装 postmessage 发送消息 和 监听 message 接收消息,然后直接返回 promise,这下就方便多了。

· 阅读需 3 分钟
givebest

浏览器扩展使用 JavaScript、HTML、CSS 开发实现,理论上可以一套代码实现适配多个浏览器。但事实上浏览器之间还是存在一些差异,比如 manifest.json 的兼容性,在这个详细的列表里 https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_compatibility_for_manifest.json 可以看到差异还是很大。不过还好,可以使用 webextension-polyfill 解决不同浏览器 API 兼容问题,或者直接使用 Plasmo 框架,这样就无需考虑配置和浏览器扩展特性兼容问题。

· 阅读需 4 分钟
givebest

一、 EditorConfig

https://editorconfig.org/

EditorConfig 有助于维护跨多个编辑器和 IDE 从事同一项目的多个开发人员的一致编码风格。EditorConfig 项目包含一个用于定义编码样式的文件格式和一个文本编辑器插件集合,这些文本编辑器插件使编辑器可以读取文件格式并遵循定义的样式。EditorConfig 文件易于阅读,并且可以与版本控制系统很好地协同工作。

· 阅读需 4 分钟
givebest

原型链

构造函数、原型和实例的关系:

  • 每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针;
  • 实例都包含了一个指向原型对象的内部指针。

· 阅读需 4 分钟
givebest

vee-validate 是为 Vue.js 量身打造的表单校验框架,允许您校验输入的内容并显示对应的错误提示信息。它内置了很多常见的校验规则,可以组合使用多种校验规则,大部分场景只需要配置就能实现开箱即用,还支持自定义正则表达式。而且支持 40 多种语言,对本地化、多语言支持非常友好。

国内饿了么团队开源项目 Element UI 就用到了 vee-validate

· 阅读需 5 分钟
givebest

这里的需求是把视频网站上的视频转换为音频文件。原来的办法是通过一系列操作把视频 mp4 文件下载到电脑,然后通过 QuickTime Player 导出为 “仅音频”。这样最麻烦地方就是下载视频,因为视频网站做了限制,下载速度非常慢,几个小时还下载不完一个几十 M 的视频,相关麻烦。

后来换了种思路,想着能不能一边播视频一边直接录制声音呢?然后就试了下,录制的是电脑喇叭里的声音,失真且有杂音。后来在网上找了下,发现了一款神器 Soundflower。通过它就可以直接录制电脑系统内播放出来的声音,真是太方便了。下面介绍一下安装和使用方法。

· 阅读需 14 分钟
givebest

现在考驾照是一年比一年难了,隔个一年半载的可能就又出新规了,当然会增加考试项目和难度。还好,经过两年的时间跨度,2019 年初终于把驾照拿到了,下面就说说我的这段经历和总结吧。

· 阅读需 11 分钟
givebest

缘起

首先 Fiil 的耳机已经买过两个,一个是头戴式的有线降噪耳机,用了段时间感觉还不错,后来感觉有线还是不方便,就慢慢搁置了。这个主打降噪,根据实际体验来说,在地铁上效果很不好,轰隆隆的嗓音还是很大,汽油公交上效果也不行,只有在电动公交上效果非常满意,开降噪听语音最小声音也能听清人声。还有就是平时中午睡觉时戴上效果也是满意的。

· 阅读需 6 分钟
givebest

因业务需求,要买一个耐用、省心、大容量、拍照好的手机。看了一圈 Android 阵营的,没有找到合适的,这也跟我多年没有太关注 Android 有关吧,大概的印象就是越卖越贵了。近几年主力机用的 iPhone,想着不如买个二手的算了。

· 阅读需 4 分钟
givebest

前言

为了提升开发效率,创建一套 UI 组件库是一种较为有效的方式之一:可以减少重复工作、提高可复用,所以现在越来越多团队开始创建自己的 UI 组件库。较早的 Twitter 的 Bootstrap 虽然只能称为 UI 库,但也大大提升了开发效率。后面 MVVM 大行其道 ,前端终于可以把 HTML、CSS、JS 放在一起开发包含 UI 、交互真正意义上的组件了,现在有基于 ReactMaterial-UI、国内阿里金服基于 ReactAnt Design、饿了么基于 Vue.jsElement、TalkingData 基于 Vue.jsiView 等。有了这些 UI 组件,让前端开发变得前所未有的方便,完成一个项目就像是拿一块块的积木(组件)堆成一个完整项目。

· 阅读需 7 分钟
givebest

前言

用了 7 年多的华硕笔记本期间自己升级了硬件依然坚挺,也和当时买的顶配有关吧。除了显卡烧坏修过一次,部分键盘按键失灵,喇叭哑了之外竟然也没有别的毛病。不得不赞华硕的质量真不错。然而硬件太老,实际使用中总是慢的让人捉急,感慨硬件发展太快,顶配也很快会过时,不如买个一般配置用几年再换新的应该还划算些。

· 阅读需 5 分钟
givebest

火于异步

1995 年,当时最流行的浏览器——网景中开始运行 JavaScript (最初称为 LiveScript)。 1996 年,微软发布了 JScript 兼容 JavaScript。随着网景、微软竞争而不断的技术更新,在 2000 年前后,JavaScript 相关的技术基础准备就绪。 随后到 2005 年前后,以 Google 为首开始重视使用 AJAX(即 Asynchronous JavaScript and XML),使得复杂的网页交互体验接近桌面应用。

· 阅读需 5 分钟
givebest

简介

基于 webpack2 实现的多入口项目脚手架,主要使用 extract-text-webpack-plugin 实现 js 、css 公共代码提取,html-webpack-plugin 实现 html 多入口,less-loader 实现 less 编译,postcss-loader 配置 autoprefixer 实现自动添加浏览器兼容前缀,html-withimg-loader 实现 html 内引入图片版本号添加和模板功能,babel-loader 实现 ES6 转码功能, happypack 多线程加速构建速度。

· 阅读需 2 分钟
givebest

最近我的 kindle 固件版本更新到 5.8.7.0.1 ,发现增加了生字注音功能,瞬间变成小学生阅读神器有木有,不过,这个功能可以隐藏、显示,看着碍眼隐藏即可,还可以减少和增加生字注音。感觉对于经常阅读的我,减少生字注音到合适范围,遇到生字、易读错的字不用手动查找词典很是方便了。

· 阅读需 23 分钟
givebest

RegExp 直接量和对象的创建

就像字符串和数字一样,程序中每个取值相同的原始类型直接量均表示相同的值,这是显而易见的。程序运行时每次遇到对象直接量(初始化表达式)诸如{}和[]的时候都会创建新对象。比如,如果在循环体中写 var a = [],则每次遍历都会创建一个新的空数组。正则表达式直接量则与此不同,ECMAScript 3 规范规定,一个正则表达式直接量会在执行到它时转换为一个 RegExp 对象,同一段代码所表示正则表达式直接量的每次运算都返回同一个对象。ECMAScript 5 规范则做了相反的规定,同一段代码所表示的正则表达式直接量的每次运算都返回新对象。I E 一直都是按照 EC-MAScript 5 规范实现的,多数最新版本的浏览器也开始遵循 EC-MAScript 5,尽管目前该标准并未全面广泛推行。