个人博客中经常需要贴一些录制的GIF动画,考虑到GIF大小会影响页面加载体验,我需要手动进行GIF压缩,压缩过程乏味且浪费时间,因此动手写个小工具来提升操作效率。

效果

选中文件,唤起Alfred,输入gif,选中Compress GIF,回车即可。

Workflow下载地址,戳这里

阅读全文 »

好久没更新过Alfred Workflow相关文章了,这里就贴下最近的一个小开发。

工作中为了聚焦码字,我经常开启Mac的防扰模式,这样不会被微信/或QQ等高频信息轰炸,但比如下班又需要关闭。鼠标移动到右侧去关闭显得低效,设置热键开关又需要记忆一组较为复杂的,这两种方式都很不程序员,于是,我决定做个workflow来快速开关。

效果

输入disturb,回车即可开关

阅读全文 »

最近运维团队报说我们的生产A系统登陆失败了。登陆不上是个大问题,业务一度想直接提P1,P1即最高级Bug,必须在2个小时内解决。事态一度紧张严重。。。

帮忙去看了下,发现提示是连接不安全,一般HTTPS连接不安全的原因会有两种可能

  1. 证书过期
  2. 证书不适用

查看了证书发现果然,证书是*.lenovomm.com,而我们系统是a.lenovo.com,因此可以断定证书错误。最后联系了相关负责人。诊断后,解释是因为证书过期,手动更新错误导致的,于是快速修复解决了。

事故虽然解决了,但是这中间有几个知识点值得梳理下,至少以后同类问题可以避免,且有必要搞懂这些。

阅读全文 »

Fantastical支持日历订阅,但尴尬的是找不到优质源,比如法定节假日及调休日。并且即使对应的日历找到了,如果作者不一直维护,还是有时效问题。

索性,自己来维护一个日历,就从最基本的中国节假日安排走起。

更新:2024年日历已更

这里先贴出订阅地址,因为我会持续更新,因此不用担心明年就失效的问题。

信息参考源

阅读全文 »

最近看到一道题,如何声明a,从而确保a ==1 && a== 2 && a==3返回true,额,虽然一眼就可以看出a需要声明为一个对象,但是却不清楚应该使用什么方法属性了,由此暴露对于JS的==运算符带来的自动类型转换还是印象不深刻,于是重新学习下。

==的隐式类型转换

如果类型不同,需要考虑基本类型和对象类型

  • 基本类型
    • 数字与字符串,字符串会转换为数字
    • 数字与布尔,布尔会转换为数字
  • 对象类型
    • 如果其中一个是对象,则会调用对象的valueOftoString方法来尝试转化为基本类型值

当然,如果是===严格相等,不存在类型转换问题。

阅读全文 »

WEB为了性能,可以上CDN,但是你真的了解CDN吗,这里梳理下原理,强化理解。

概念

内容分发网络(英语:Content Delivery Network或Content Distribution Network,缩写:CDN)是指一种透过互联网互相连接的电脑网络系统,利用最靠近每位用户的服务器,更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户,来提供高性能、可扩展性及低成本的网络内容传递给用户。

以上摘自WIKI,作为基本概念了解,接下来理解下CDN的实现原理

原理

阅读全文 »

想要深入理解JS,就需要了解v8,通过v8-debug方便去理解字节码,JS优化等等。这里记录下v8-debug的安装

安装

网上有提到brew install v8,但安装后发现没有–print-ast选项,原因不明,因此不建议

  1. npm install jsvu -g

  2. jsvu运行,选择V8 debug即可安装OK,安装后如果重新执行jsvu,则会更新已安装v8

  3. bash或者zsh配置如下

    • export PATH=”${HOME}/.jsvu:${PATH}”

    • alias d8=’v8-debug’

      别名配置主要为了方便使用

JIRA作为我们团队的项目管理工具是工具链中的一环。平时站会每个人也是基于JIRA上的看板来陈述自己做的事情及遇到的问题,但JIRA还是有体验差的地方,比如说Kanban board中的Quick Filters,不支持单选,每次选择都是叠加,这点并不利于我们去快速切换不同filter下的card。

烦不胜烦,借着节假日,我就索性利用Chrome extension来解决下。

解决问题

quick filters实现单选

效果

阅读全文 »

本着DRY,本着生产力,前端基础设施有很多事情可以做。UI组件库,自定义ESLintRule,ESLint配置共享,CI配置共享等,这些机制可以一定程度的提升前端工作效率,但还有一个环节需要优化。 工作中本身并不单单只有一个项目,每个项目如果都开始从配置,实际上效率会很低。 为此业界有了很多的脚手架,比如creat-react-app,jhipster,但是第三方的往往要么过于简单,要么臃肿,根据自己实际需求打造脚手架才更为顺手。于是yeoman就派上用场了。

yeoman干嘛的?THE WEB’S SCAFFOLDING TOOL FOR MODERN WEBAPPS。

没错,要的就是它,开搞。

配置步骤

  1. 创建生成器项目,比如这里叫generator-react-web,注意前缀固定为generator-
  2. 创建模版项目,比如这里我只创建一个react-web-template
  3. 生成器项目配置,主要支持用户选择配置选项
  4. npm link映射本地模块,方便测试
  5. OK后进行包发布,比如这里我是用NPM公共源发布
  6. 成功后,即可开心开启新项目了
    1
    2
    3
    $ npm install -g generator-react-web.
    $ npm install -g @stacker/generator-react-web
    $ yo @stacker/react-web
阅读全文 »
0%