<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Hikerpig 万事记]]></title><description><![CDATA[Hikerpig 万事记]]></description><link>https://www.hikerpig.cn</link><generator>GatsbyJS</generator><lastBuildDate>Mon, 10 Feb 2025 05:06:12 GMT</lastBuildDate><item><title><![CDATA[关于我]]></title><description><![CDATA[我是一个住在北京的前端工程师，这里是个技术博客。 间或穿插一些喜欢听的歌以及它们的入门版乐谱。 社交网络:  github  豆瓣，半只读状态。  twitter，好久没说话。]]></description><link>https://www.hikerpig.cn/about/</link><guid isPermaLink="false">https://www.hikerpig.cn/about/</guid></item><item><title><![CDATA[浅读 Build systems à la carte]]></title><description><![CDATA[简介 粗暴翻译成《构建系统点菜谱》。 DOI: 10.1145/3236774 这是一篇 201…]]></description><link>https://www.hikerpig.cn/2025-02-08-浅读-Build-systems-a-la-carte/</link><guid isPermaLink="false">https://www.hikerpig.cn/2025-02-08-浅读-Build-systems-a-la-carte/</guid><pubDate>Sat, 08 Feb 2025 00:00:00 GMT</pubDate></item><item><title><![CDATA[静态检查能力升级 - ESLint + TypeScript 自定义规则]]></title><description><![CDATA[一个 BUG 引起的思考 之前修过一个 bug，由于 class 组件上的方法没有 @autobind，也没有使用箭头函数，导致取 this 时候报错。大致示意如下： 有没有办法静态分析出来这种问题呢？ 使用 typescript-eslint…]]></description><link>https://www.hikerpig.cn/2022-01-19-typescript-eslint/</link><guid isPermaLink="false">https://www.hikerpig.cn/2022-01-19-typescript-eslint/</guid><pubDate>Wed, 19 Jan 2022 00:00:00 GMT</pubDate></item><item><title><![CDATA[为 Pintora 写一个 VSCode 插件]]></title><description><![CDATA[Pintora 是我最近在折腾的一个开源项目，类似于 Mermaid.js 和 PlantUML，由文字生成图表。 光是有在线编辑器还不太够，花了几天折腾了一个 VSCode 插件 - pintora-vscode…]]></description><link>https://www.hikerpig.cn/2022-01-15-write-a-vscode-extension-for-pintora/</link><guid isPermaLink="false">https://www.hikerpig.cn/2022-01-15-write-a-vscode-extension-for-pintora/</guid><pubDate>Sat, 15 Jan 2022 00:00:00 GMT</pubDate></item><item><title><![CDATA[懒惰是美德 ✌ 别再用手拖时序图了]]></title><description><![CDATA[Diagram as Text 可以省去手绘 UML 图表时调整布局等的时间。
通过文本 DSL 生成图表。文本本身也具有一些可读性，以及（划重点！）对 git diff 友好。在不断演变的技术文档内使用还是比较合理的。 适合什么情况 画常用的几种 UML…]]></description><link>https://www.hikerpig.cn/2021-11-24-laziness-as-a-virtue-no-more-handdraw-sequence-diagram/</link><guid isPermaLink="false">https://www.hikerpig.cn/2021-11-24-laziness-as-a-virtue-no-more-handdraw-sequence-diagram/</guid><pubDate>Wed, 24 Nov 2021 00:00:00 GMT</pubDate></item><item><title><![CDATA[Chromium 90, 给前端用的 devtools 的前端写得有性能问题]]></title><description><![CDATA[以此拗口又搞笑的标题纪念一下人生第一次给 Chromium 项目提的 issue，在学会了 tracing 工具的使用方式之后，也会有更多提 bug issue 的机会。 缘起 4月中旬后的一周里，感觉使用 Chrome Devtools…]]></description><link>https://www.hikerpig.cn/2021-04-25-Chromium90-Devtools-Performance-Issue/</link><guid isPermaLink="false">https://www.hikerpig.cn/2021-04-25-Chromium90-Devtools-Performance-Issue/</guid><pubDate>Sun, 25 Apr 2021 00:00:00 GMT</pubDate></item><item><title><![CDATA[TS 实现一个可在 React 项目中使用的简单依赖注入系统]]></title><description><![CDATA[简介，什么是依赖注入 在说依赖注入之前，我们发现有个概念叫做 “控制反转”经常一起出现，它们区别是： 控制反转(Inversion of Control)是一种设计思想 依赖注入(Dependency Injection…]]></description><link>https://www.hikerpig.cn/2021-01-21-A-Simple-DI-System-For-React-Project-Logic/</link><guid isPermaLink="false">https://www.hikerpig.cn/2021-01-21-A-Simple-DI-System-For-React-Project-Logic/</guid><pubDate>Thu, 21 Jan 2021 00:00:00 GMT</pubDate></item><item><title><![CDATA[万物皆可 fzf]]></title><description><![CDATA[fzf 是一个速度和适用范围都极好的模糊搜索工具，借助 UNIX 管道，可以接入日常几乎所有终端 CLI 操作中，对所有的 list 都能有美好的可交互式模糊过滤体验。 It's an interactive Unix filter for command-line that…]]></description><link>https://www.hikerpig.cn/2021-01-08-fzf-everything/</link><guid isPermaLink="false">https://www.hikerpig.cn/2021-01-08-fzf-everything/</guid><pubDate>Fri, 08 Jan 2021 00:00:00 GMT</pubDate></item><item><title><![CDATA[Caddy 2 和 Cloudflare 配合]]></title><description><![CDATA[最近重装云主机，需要重新安装和部署以前一些个人站点，我的需求比较简单，一般就是部署静态文件或是 Vue/React SSR 应用，还有一些尝鲜的开源 self-host 项目(miniflux / plausible analytics…]]></description><link>https://www.hikerpig.cn/2020-11-06-Caddy2-and-Cloudflare/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-11-06-Caddy2-and-Cloudflare/</guid><pubDate>Fri, 06 Nov 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[博客改写迁移记]]></title><description><![CDATA[最近看到 Digital Garden 这个 Gatsby 主题，觉得 Gatsby 这种轻易转换不同数据源（一般多通过 remark 支持 markdown 文件， 作者自己订制支持了 Roam Research）的能力很不错。 决定迁移一下自己旧的 Hexo…]]></description><link>https://www.hikerpig.cn/2020-10-24-blog-migration/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-10-24-blog-migration/</guid><pubDate>Sat, 24 Oct 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[使用 zimfw 作为 zsh 配置框架]]></title><description><![CDATA[之前使用 oh-my-zsh 的自带 git/nvm 等插件有时候有性能问题，同时据说其框架本身相比其他一些主打速度的配置框架(prezto/zimfw 等)也会慢一点。 稍微折腾了一下，使用 zimfw 作为 zsh…]]></description><link>https://www.hikerpig.cn/2020-10-14-zsh-zimfw-setup/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-10-14-zsh-zimfw-setup/</guid><pubDate>Wed, 14 Oct 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[Hiding My Heart 🎵]]></title><description><![CDATA[一首词曲创作和演唱都很优秀的乡谣，出自 Brandi Carlile 2007 年的专辑 The Story 。 The Story 词曲都由 Tim Hanseroth (Timothy Jay Hanseroth) 所做，他是与 Brandi Carlile…]]></description><link>https://www.hikerpig.cn/2020-09-04-Hiding-My-Heart/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-09-04-Hiding-My-Heart/</guid><pubDate>Fri, 04 Sep 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[Mermaid.js - 一个刚刚好的开源产品]]></title><description><![CDATA[Mermaid.js 凭借一己之力，提升了技术博客内的时序图/类图等 UML 图表的覆盖率。 文档里这句话道出了这个项目的存在意义： There is no explanation like a Good Diagram - 一图胜千言 在 Web…]]></description><link>https://www.hikerpig.cn/2020-08-28-Mermaid.js-as-a-nice-product/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-08-28-Mermaid.js-as-a-nice-product/</guid><pubDate>Fri, 28 Aug 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[Toc Bar Userscript - 一个显示页面大纲的油猴脚本]]></title><description><![CDATA[Toc Bar 一个自用的油猴脚本，在页面中插入一个显示当前内容大纲的浮动组件，可去 greasyfork 下载。 目前适配了一些个人经常访问的网站，主要面向技术阅读，知乎/Medium/devto/github 之类。 ✨Features 使用 tocbot 生成 Table…]]></description><link>https://www.hikerpig.cn/2020-07-02-Toc-Bar-Userscript/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-07-02-Toc-Bar-Userscript/</guid><pubDate>Thu, 02 Jul 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[工作和个人项目使用不同 gitconfig]]></title><description><![CDATA[首先在  ~/.gitconfig 中设定如下，注意 gitdir 后面的 ~/work/ 末尾的 / 不能少。 然后这两个文件就可以单独设置一些项目了。 例如 ~/.gitconfig-personal…]]></description><link>https://www.hikerpig.cn/2020-06-05-Separate-Git-Config-By-Directories/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-06-05-Separate-Git-Config-By-Directories/</guid><pubDate>Fri, 05 Jun 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[初识 Web Audio API - 术语扫盲]]></title><description><![CDATA[Web Audio 提供了一个基于图的音频处理构建体系，这个系统里的单元为各种音频节点（AudioNode），可模块化连接（modular routing）。这个体系被业界广泛认同多年，有很多成熟的应用和系统，例如 Apple CoreAudio…]]></description><link>https://www.hikerpig.cn/2020-03-16-A-Glimpse-Of-Web-Audio-API/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-03-16-A-Glimpse-Of-Web-Audio-API/</guid><pubDate>Mon, 16 Mar 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[一次 Webpack 下的 Vuex HMR 尝试]]></title><description><![CDATA[使用 Webpack 构建 Vue 项目时，借助 vue-loader 和 vue-hot-reload-api，我们在开发的时候可以获得很好的组件热加载（Hot Module Replacement）体验。然而 vue-loader 中却没有关于 vuex…]]></description><link>https://www.hikerpig.cn/2020-03-07-Vuex-Webpack-HMR/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-03-07-Vuex-Webpack-HMR/</guid><pubDate>Sat, 07 Mar 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[我的常用正则表达式清单]]></title><description><![CDATA[转换 medium 的一篇文章有列出几种常见命名方式转换的 JS 函数 CamelCase -> kebab-case javascript 使用示例 其中使用了正向前瞻 (positive lookahead)，有一些 参考文章 可以学习一下。 kebab-case/snake…]]></description><link>https://www.hikerpig.cn/2020-02-19-Regex-Collection/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-02-19-Regex-Collection/</guid><pubDate>Wed, 19 Feb 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[Awesome UltiSnips]]></title><description><![CDATA[UltiSnips 不愧为 vim （或乃至所有编辑器）生态下的最佳代码片段解决方案。支持多种常见语法、snippet 添加和管理符合直觉（此处应 cue 一下隔壁对多行文本支持令人垂泪的 vscode）、还有眼花缭乱的 python…]]></description><link>https://www.hikerpig.cn/2020-02-05-Awesome-UltiSnips/</link><guid isPermaLink="false">https://www.hikerpig.cn/2020-02-05-Awesome-UltiSnips/</guid><pubDate>Wed, 05 Feb 2020 00:00:00 GMT</pubDate></item><item><title><![CDATA[浏览器 IndexedDB 存储限制]]></title><description><![CDATA[以下列出在 夺目 产品的开发中，对 WebStorage 和 IndexedDB 使用的一些经验。 WebStorage 存储空间限制 首先，存储分为两种： 临时存储 (Temporary Storage)，默认类型，之后可能会被浏览器删除。 持久存储 (Persistent…]]></description><link>https://www.hikerpig.cn/2019-12-11-Browser-Storage-Limit/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-12-11-Browser-Storage-Limit/</guid><pubDate>Wed, 11 Dec 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[编译 Skia canvaskit.wasm]]></title><description><![CDATA[Skia 是 Google 一个开源的跨平台图形库，用于 Android, Chromium, Flutter 等项目。目前项目内有在开发的一个 Skia + WebAssembly 版的 CanvasKit, 可以使用 JS    调用预先编译好的 c++ -> wasm…]]></description><link>https://www.hikerpig.cn/2019-09-24-Compile-Skia-Canvaskit-WASM/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-09-24-Compile-Skia-Canvaskit-WASM/</guid><pubDate>Tue, 24 Sep 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[在浏览器端检测电脑是否刚从休眠中醒来]]></title><description><![CDATA[当电脑进入休眠状态，浏览器的一些持久功能会受到影响(例如 WebSocket 连接中断)，有时需要在从休眠状态中恢复过来的时候做一些检查和恢复工作。 解决方案 利用计时器 参考 Can any desktop browsers detect when the computer…]]></description><link>https://www.hikerpig.cn/2019-09-04-Detect-Computer-Resume-From-Sleep-In-Browser/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-09-04-Detect-Computer-Resume-From-Sleep-In-Browser/</guid><pubDate>Wed, 04 Sep 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[命令行下的图片压缩工具]]></title><description><![CDATA[imagemin-cli imagemin/imagemin-cli 是一个用 node.js 写的工具，调用的都是纯 CLI 的开源程序，所以平台兼容性好很多。其依赖的 imagemin 项目支持 imagemin-* 形式的 npm package 插件扩展，cli…]]></description><link>https://www.hikerpig.cn/2019-08-20-Run-Image-Optimize-With-Cli/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-08-20-Run-Image-Optimize-With-Cli/</guid><pubDate>Tue, 20 Aug 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[使用 Typescript 加强 Vuex 使用体验]]></title><description><![CDATA[碰到的问题 如履针毡的状态管理和业务逻辑调用 Vuex 使用了统一的 dispatch/commit 方法去触发 Action 和 Mutation, 如果使用嵌套的 module, Vuex 还会解析命名空间，以找到正确的 Action/Mutation…]]></description><link>https://www.hikerpig.cn/2019-06-17-typescript-powered-vuex/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-06-17-typescript-powered-vuex/</guid><pubDate>Mon, 17 Jun 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[图像近似高斯模糊的快速实现，以及 WebAssembly 模块的导出]]></title><description><![CDATA[在图像处理软件中的模糊滤镜一般都会有高斯模糊（Gaussian Blur…]]></description><link>https://www.hikerpig.cn/2019-05-13-Fastblur-implemetation-with-rust/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-05-13-Fastblur-implemetation-with-rust/</guid><pubDate>Mon, 13 May 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[使用 d8 快速测试 WebAssembly 模块性能]]></title><description><![CDATA[d8 是 v8 的简易 CLI，它提供了一个极简的 JS 宿主环境，可用于 v8 的学习和调试，比起 nodejs，它更精简和专注。 除了 JS 以外，d8 也具有 WASM 的解释功能，可以方便地用于测试 WASM 模块的性能。如果你的 WASM…]]></description><link>https://www.hikerpig.cn/2019-05-05-Benchmark-WASM-with-d8/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-05-05-Benchmark-WASM-with-d8/</guid><pubDate>Sun, 05 May 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[Handy Video Analyze Tool]]></title><description><![CDATA[最近在写一些跟视频解码相关的简单程序，学习 avcodec 技术时有一些强大的分析工具，分享一下。 码流与封装容器相关 ISO Viewer isoviewer 是 Mac 下一个检查 mp4 文件构成的 GUI 程序，能直观地看到各个 box 的数据。 bento4 bento…]]></description><link>https://www.hikerpig.cn/2019-03-13-Handy-Video-Analyze-Tool/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-03-13-Handy-Video-Analyze-Tool/</guid><pubDate>Thu, 14 Mar 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[Decode Video Using ffmpeg In Browser]]></title><description><![CDATA[音视频开发入门，可能绕不开 ffmpeg 这个项目，最近看了篇 知乎专栏，觉得这个事情很有意思。 比起直接编辑整个 ffmpeg 项目的 CLI 到前端，更符合实际需求的方式，是先基于 ffmpeg 各种 lib…]]></description><link>https://www.hikerpig.cn/2019-03-06-Decode-Video-Using-FFMpeg-In-Browser/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-03-06-Decode-Video-Using-FFMpeg-In-Browser/</guid><pubDate>Wed, 06 Mar 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[在 docker 环境中从 gitlab 拉取源码]]></title><description><![CDATA[前注：在 docker 镜像中拉取 git 仓库似乎是一种 anti-pattern，本文只是记录中间的踩坑经历。 托管在公司 gitlab 上的一个前端项目，最近在尝试 docker 化。 准备阶段 Gitlab 上的一些问题 如果项目不是公开的，从 docker…]]></description><link>https://www.hikerpig.cn/2019-02-14-Setup-CI-in-docker/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-02-14-Setup-CI-in-docker/</guid><pubDate>Fri, 15 Feb 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[Tips On Viewing Logs]]></title><description><![CDATA[面对浩如烟海的 log，在排查错误和查找信息时使用一些趁手的工具，快速定位，关爱视力，有益身心健康。 高级的工具 lnav lnav 是一个非常强大的日志查看器，有多种视图和过滤功能，不过最喜欢的其实还是自动的颜色高亮。 lnav…]]></description><link>https://www.hikerpig.cn/2019-03-08-Tips-On-Viewing-Logs/</link><guid isPermaLink="false">https://www.hikerpig.cn/2019-03-08-Tips-On-Viewing-Logs/</guid><pubDate>Fri, 15 Feb 2019 00:00:00 GMT</pubDate></item><item><title><![CDATA[CSS 中的两种模糊半径]]></title><description><![CDATA[CSS 中两种实现阴影的方式 text-shadow 和 box-shadow filter: drop-shadow 前者的 blur-radius 指的是阴影的最外延半径，后者的 blur-radius 指的是高斯模糊中的标准差($σ) W3C 的 CSS…]]></description><link>https://www.hikerpig.cn/2018-12-22-svg-blur-and-css-text-shadow/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-12-22-svg-blur-and-css-text-shadow/</guid><pubDate>Sat, 22 Dec 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[浏览器中的字体信息测量]]></title><description><![CDATA[题图来自 http://iamvdo.me/en/blog/css-font-metrics-line-height-and-vertical-align 为什么同样的 font-size ，文字高度不一样？ 每个字体在设计的时候，都是基于一个 EM Square…]]></description><link>https://www.hikerpig.cn/2018-11-15-font-metrics-in-browser/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-11-15-font-metrics-in-browser/</guid><pubDate>Thu, 15 Nov 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[SVG 元素的自定义  transform origin]]></title><description><![CDATA[不要使用 transform-origin 属性 SVG 支持 transform，而且写法似乎与 CSS 中相同，但是它的标准里并不支持 transform-origin 属性。虽然在部分浏览器中，给 SVG 元素指定 transform-origin…]]></description><link>https://www.hikerpig.cn/2018-08-26-beware-of-svg-transform/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-08-26-beware-of-svg-transform/</guid><pubDate>Sun, 26 Aug 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[Goodbye My Santa Monica Dream 🎵]]></title><description><![CDATA[从《Life is strange》的原声带中发现的瑰宝，来自澳大利亚的兄妹组合 Angus & Julia Stone 的一首略显忧伤的曲子，他俩前几年的曲风，小清新中带着些许迷幻。妹妹声音空灵慵懒，像加州的海风，棕榈叶间斑驳的阳光，和歌词特别配。 原曲使用 Open D…]]></description><link>https://www.hikerpig.cn/2018-07-31-Goodbye My Santa Monica Dream/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-07-31-Goodbye My Santa Monica Dream/</guid><pubDate>Tue, 31 Jul 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[Vuex 模块动态注册的一些实践经验]]></title><description><![CDATA[前言 构建大型 SPA 应用时，代码分割和懒加载是比较常用的优化手段，在 Vue 生态下，使用 vue-router 很容易实现组件的懒加载。 但应用里除了组件，还有庞大的业务逻辑，这部分如何分割和懒加载比较合适呢？ 使用 Vuex…]]></description><link>https://www.hikerpig.cn/2018-07-03-Vuex-Dynamic-Module-Hints/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-07-03-Vuex-Dynamic-Module-Hints/</guid><pubDate>Tue, 03 Jul 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[Try Rust WebAssembly]]></title><description><![CDATA[在公司项目里的一个小角落，尝试使用 Rust + WebAssembly 加速应用里部分计算 选择 首先要分清项目里 WebAssembly 的定位 应用主体：完成绝大多数逻辑，JS 只作为加载入口和少部分事件绑定桥梁 工具库：分担一些复杂和耗时的计算，由 JS…]]></description><link>https://www.hikerpig.cn/2018-05-03-Try-Rust-Webassemly/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-05-03-Try-Rust-Webassemly/</guid><pubDate>Thu, 03 May 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[用 Jest 单元测试基于 Vue 的项目]]></title><description><![CDATA[为一个基于 Vue 的项目搭建测试框架，有两个比较成熟的选择，Mocha + Webpack + Karma，或是 Jest。 前者也是 vue-cli 默认脚手架里的测试方案，我们之前的项目也用了它，实际使用起来，感觉成也 Karma，败也 Karma…]]></description><link>https://www.hikerpig.cn/2018-04-06-Write-Vue-Tests-in-Jest/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-04-06-Write-Vue-Tests-in-Jest/</guid><pubDate>Fri, 06 Apr 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[在 Typescript 中继承 Error 对象]]></title><description><![CDATA[通过 Typescript class 继承 Error 实现自定义错误类型并编译到 ES5 时，遇到了一个坑。 compilerOptions.target 设为 "es5"。 但是运行起来： 原因 使用 Babel/Typescript…]]></description><link>https://www.hikerpig.cn/2018-04-02-Customize-Error-in-Typescript/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-04-02-Customize-Error-in-Typescript/</guid><pubDate>Mon, 02 Apr 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[在 Typescript 中使用可被复用的 Vue Mixin]]></title><description><![CDATA[转到用 Typescript 写 Vue 应用以后，经过一轮工具链和依赖的洗礼，总算蹒跚地能走起来了，不过有一个很常用的功能 mixin，似乎还没有官方的解决方案。 既想享受 mixin 的灵活和方便，又想收获 ts 的类型系统带来的安全保障和开发时使用 IntelliSense…]]></description><link>https://www.hikerpig.cn/2018-01-21-typed-vue-mixins/</link><guid isPermaLink="false">https://www.hikerpig.cn/2018-01-21-typed-vue-mixins/</guid><pubDate>Sun, 21 Jan 2018 00:00:00 GMT</pubDate></item><item><title><![CDATA[ES6 Class 和 Babel 6 在 IE 10 及以下时候的一个坑]]></title><description><![CDATA[写 ES6+ 一定逃不开 babel，也避不开调试 babel 生成的一些代码。 当输入一段 ES6 Class 代码时: 问题 在开发常用的浏览器 Chrome 和 Firefox 里正常工作，但是在 IE10 下会报错 Uncaught TypeError…]]></description><link>https://www.hikerpig.cn/2017-09-25-ES6+Babel-little-bug-under-IE11/</link><guid isPermaLink="false">https://www.hikerpig.cn/2017-09-25-ES6+Babel-little-bug-under-IE11/</guid><pubDate>Mon, 25 Sep 2017 00:00:00 GMT</pubDate></item><item><title><![CDATA[使用 Object.create(null) 创建空对象]]></title><description><![CDATA[使用对象字面量形式时，隐式地创建了一个以 Object.prototype 作为原型的对象。 以下两种方式等同。 更省事的方法 创建一个不继承任何原型的对象。 如果需要创建一个简单的 map 性质的对象，使用此种方式，在对 o…]]></description><link>https://www.hikerpig.cn/2017-09-07-Using-Object.create/</link><guid isPermaLink="false">https://www.hikerpig.cn/2017-09-07-Using-Object.create/</guid><pubDate>Thu, 07 Sep 2017 00:00:00 GMT</pubDate></item><item><title><![CDATA[给开发减压的 gulp.watch 配置]]></title><description><![CDATA[Gulp 的文件监听使用了 gaze，如果只看了 Gulp 的 API 文档可能会漏掉一些参数。 Gulp 文档 中提到: gulp.watch(glob[, opts], tasks) options 包括: interval {integer} Interval to…]]></description><link>https://www.hikerpig.cn/2017-08-22-gulp-watch-for-poor-cpu/</link><guid isPermaLink="false">https://www.hikerpig.cn/2017-08-22-gulp-watch-for-poor-cpu/</guid><pubDate>Tue, 22 Aug 2017 00:00:00 GMT</pubDate></item><item><title><![CDATA[Holy Awesome Spacemacs]]></title><description><![CDATA[很久以前看 SICP 的时候尝试在 windows 下使用 emacs 时受到了惊吓，那刀耕火种一般的界面啊。后来在 Ubuntu 终端中打开，诶？怎么关不掉？不掉？掉？（其实 Vim 也一样，小白终结者） 但是看完如何评价 Emacs 的配置文件 Spacemacs…]]></description><link>https://www.hikerpig.cn/2017-08-05-Holy-Awesome-Spacemacs/</link><guid isPermaLink="false">https://www.hikerpig.cn/2017-08-05-Holy-Awesome-Spacemacs/</guid><pubDate>Sat, 05 Aug 2017 00:00:00 GMT</pubDate></item><item><title><![CDATA[前端 Log 小记]]></title><description><![CDATA[相信各位前端工程师们都经历过一个黑暗的场景。 (哎哟哎哟测试大人我什么也没说) 曾经有一个出现bug…]]></description><link>https://www.hikerpig.cn/2016-12-21-Enhanced-Client-Side-Console/</link><guid isPermaLink="false">https://www.hikerpig.cn/2016-12-21-Enhanced-Client-Side-Console/</guid><pubDate>Wed, 21 Dec 2016 00:00:00 GMT</pubDate></item><item><title><![CDATA[[译] 使用重构件（Codemod）加速 JavaScript 开发]]></title><description><![CDATA[原文链接 : Turbocharged JavaScript refactoring with codemods 原文作者 : Joe Lencioni 使用重构件（Codemod）加速 JavaScript…]]></description><link>https://www.hikerpig.cn/2016-06-02-turbocharged-javascript-refactoring-with-codemods/</link><guid isPermaLink="false">https://www.hikerpig.cn/2016-06-02-turbocharged-javascript-refactoring-with-codemods/</guid><pubDate>Thu, 30 Jun 2016 00:00:00 GMT</pubDate></item><item><title><![CDATA[[译] Javascript 姿势提升简略]]></title><description><![CDATA[原文链接 : Leveling Up Your JavaScript 原文作者 : Raymond Camden JavaScript 是一门入门容易，但是相当难以精通的语言。可现今一些文章总假设你已经精通了它。 我从 1995 年 JavaScript…]]></description><link>https://www.hikerpig.cn/2016-04-28-译-Javascript-姿势提升简略/</link><guid isPermaLink="false">https://www.hikerpig.cn/2016-04-28-译-Javascript-姿势提升简略/</guid><pubDate>Thu, 28 Apr 2016 00:00:00 GMT</pubDate></item><item><title><![CDATA[Test FileReader methods]]></title><description><![CDATA[最近一个需求，需要用浏览器读取图片在前端缩略显示并且根据文件信息排序。 最近jsperf挂了, V2还在开发不太好用, 现在这里存个档。 使用Benchmark.js测试性能 写一个小页面测试两种方法速度: 结果 在我的MBP上测试:]]></description><link>https://www.hikerpig.cn/2015-07-11-Test-FileReader-methods/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-07-11-Test-FileReader-methods/</guid><pubDate>Sat, 11 Jul 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[使用python编写vim脚本 对齐赋值语句]]></title><description><![CDATA[JSer们，不管是前后端，文件头的dependency部分堆积了一群犬牙交错的require语句的时候，内心有没有过一个冲动把它们全都捋一遍全对齐了！各种foramtter给平日的眼净心静贡献了不少力量，不过我印象中ST,VIM,Webstorm…]]></description><link>https://www.hikerpig.cn/2015-04-16-Align-your-assignment-sentence-using-Python-in-Vim/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-04-16-Align-your-assignment-sentence-using-Python-in-Vim/</guid><pubDate>Thu, 16 Apr 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[用Tagbar在VIM中查看scss文件代码结构]]></title><description><![CDATA[在~/.ctags里加上这几行定义下scss文件的规则: 在~/.vimrc里加上这几行(前提是VIM有安装Tagbar插件哦) 写正则真是越来越好玩了。]]></description><link>https://www.hikerpig.cn/2015-02-05-show-scss-code-outline-with-Tagbar/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-02-05-show-scss-code-outline-with-Tagbar/</guid><pubDate>Thu, 05 Feb 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[用 JS 写简单的 CSS Parser]]></title><description><![CDATA[用正则表达式提取规则 JotForm团队的一篇文章 分解一下 输入这个css文本: 得到结果是这样: 好吧其实没那么容易, 例如Media Query就没考虑到吧]]></description><link>https://www.hikerpig.cn/2015-02-02-simple-css-parser-with-js/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-02-02-simple-css-parser-with-js/</guid><pubDate>Mon, 02 Feb 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[使用Coffeetags在VIM中显示coffee文件代码结构]]></title><description><![CDATA[VIM的插件Tagbar可以在侧边栏显示当前代码结构，不过Tagbar使用的ctags不支持coffeescript。 不过我们可以使用ruby版本的CoffeeTags生成tags。 首先: 然后只要在~/.vimrc里加上下面几行配置。(参考CoffeeTags…]]></description><link>https://www.hikerpig.cn/2015-01-28-使用Coffeetags在VIM中显示coffee文件代码结构/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-01-28-使用Coffeetags在VIM中显示coffee文件代码结构/</guid><pubDate>Wed, 28 Jan 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[用Sass写一个loading动画类]]></title><description><![CDATA[继续 Codepen 上的Sass魔法门。 这位童鞋做了两个loading动画的样式]]></description><link>https://www.hikerpig.cn/2015-01-26-用Sass写一个loading动画类/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-01-26-用Sass写一个loading动画类/</guid><pubDate>Mon, 26 Jan 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[用Sass搞定Flat风格的图标长投影]]></title><description><![CDATA[Hello 让我们来学习Hugo Giraudel老师的这篇文章 亲爱的童鞋们如果过去两年没有长眠不醒的话一定知道这个长长的投影的故事(2015应该是Material Design…]]></description><link>https://www.hikerpig.cn/2015-01-26-用Sass搞定Flat风格的图标长投影/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-01-26-用Sass搞定Flat风格的图标长投影/</guid><pubDate>Mon, 26 Jan 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[好用的Sass Mixin]]></title><description><![CDATA[看下CSS Trick上的帖子 用:nth-child快速生成一个row]]></description><link>https://www.hikerpig.cn/2015-01-24-好用的Sass-Mixin/</link><guid isPermaLink="false">https://www.hikerpig.cn/2015-01-24-好用的Sass-Mixin/</guid><pubDate>Sat, 24 Jan 2015 00:00:00 GMT</pubDate></item><item><title><![CDATA[Vim实用设置]]></title><description><![CDATA[不定时更新，同时一些收集到的文章会放在 我的 wiki 里。 Get rid of ^M 去掉行尾空格 瞬间输入当前目录和文件名 具体每一个修饰符的意思可以:help expand()看下 切换工作目录到当前编辑文件目录下 参见 Vim Tips Wiki…]]></description><link>https://www.hikerpig.cn/2014-05-30-Vim实用设置/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-05-30-Vim实用设置/</guid><pubDate>Fri, 30 May 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[正则也可以很好玩]]></title><description><![CDATA[正则填字游戏 Debuggex 可视化正则匹配过程, 用于调试十分方便 regexper 一个把javascript正则表达式转换成图表的工具网站。]]></description><link>https://www.hikerpig.cn/2014-04-29-正则也可以很好玩/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-04-29-正则也可以很好玩/</guid><pubDate>Tue, 29 Apr 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[Coffeescript小角落，和javascript混写]]></title><description><![CDATA[在coffeescript-madness中提到了用coffee的literal来在函数内部强制生成局部变量，防止对外层变量的意外修改，例如coffee…]]></description><link>https://www.hikerpig.cn/2014-04-22-Coffeescript小角落，和javascript混写/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-04-22-Coffeescript小角落，和javascript混写/</guid><pubDate>Tue, 22 Apr 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[用 ssh reverse tunnel 调用远程服务器的剪切板使用]]></title><description><![CDATA[用ssh在远程服务器上工作的时候看着vim的满屏代码，突然怎么都没办法复制下来（其实鼠标还是可以用的，不过如果内容多到跨屏那就呵呵呵了），真是急死人，万能的google啊帮助我吧。 在本机上要做的事 先用netcat…]]></description><link>https://www.hikerpig.cn/2014-04-10-用ssh-reverse-tunnel调用远程服务器的剪切板使用/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-04-10-用ssh-reverse-tunnel调用远程服务器的剪切板使用/</guid><pubDate>Thu, 10 Apr 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[在Jekyll博客里优雅地嵌入Github Gist]]></title><description><![CDATA[Gist 是 Github 一个Snippet托管平台，也是全球秀代码和吵架的好地方。 例如我的一个虾米签到gist，官方提示的嵌入写法是这样的： 可以在markdown文档里直接插入这一句，jekyll把文章转成静态网页，用户打开后会加载。 不过这同步的script…]]></description><link>https://www.hikerpig.cn/2014-04-08-在Jekyll博客里优雅地嵌入Github-Gist/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-04-08-在Jekyll博客里优雅地嵌入Github-Gist/</guid><pubDate>Tue, 08 Apr 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[让 oh-my-zsh 的git插件飞起来]]></title><description><![CDATA[更新：2020-03-26 作为一个伪文艺程序员，在ubuntu上使用zsh搭配OMG的插件oh-my-zsh，小日子曾经过的滋滋润润，各种auto-completion让我基本上爱上Tab键了。后来换了台旧MBP，每次跑到项目文件夹下git checkout feat (tab…]]></description><link>https://www.hikerpig.cn/2014-04-04-让oh-my-zsh的gitfast插件拯救你/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-04-04-让oh-my-zsh的gitfast插件拯救你/</guid><pubDate>Fri, 04 Apr 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[放过Pygments,让Prism来给Jekyll博客加上代码高亮]]></title><description><![CDATA[jekyll目前至少支持Redcarpet和RDiscount以及kramadown几种类markdown引擎， rdiscount 是基于C实现的 markdown 引擎 discount 的ruby…]]></description><link>https://www.hikerpig.cn/2014-03-31-放过Pygments/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-03-31-放过Pygments/</guid><pubDate>Mon, 31 Mar 2014 00:00:00 GMT</pubDate></item><item><title><![CDATA[git hook中的$GIT_DIR]]></title><description><![CDATA[一直使用githook post-update来部署我的jekyll博客，每次push到远程git仓库的时候，在vps上的生产目录会自动更新和重新生成页面和静态资源， post-update文件是这样的： 但是执行的时候会出现一个奇怪的问题： 最后的这一句表示出错了，而且git…]]></description><link>https://www.hikerpig.cn/2014-03-23-git-hook中的$GIT_DIR变量/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-03-23-git-hook中的$GIT_DIR变量/</guid><pubDate>Sun, 23 Mar 2014 10:09:12 GMT</pubDate></item><item><title><![CDATA[git小技巧七七八八]]></title><description><![CDATA[利用git rev-parse 刚来公司的时候，电脑上的项目运行环境还没有搭配好，一些前端的改动只能推到测试服务器上才能看见效果。因此在开发的时候要频繁地切换和合并开发分支到与测试环境的部署相关联的测试分支上,频繁地手敲命令checkout -> pull -> 等代码p…]]></description><link>https://www.hikerpig.cn/2014-03-21-git小技巧七七八八/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-03-21-git小技巧七七八八/</guid><pubDate>Fri, 21 Mar 2014 10:09:12 GMT</pubDate></item><item><title><![CDATA[Web开发国内常用源]]></title><description><![CDATA[国内配置开发环境的时候经常会要用到的这几个源, thanks to G*F*W  ，我们自行get找国内镜像的能力: Python PyPI (pip) 添加 Node NPM 添加 CNPM的源 RVM and Ruby gem RVM Ruby Gem…]]></description><link>https://www.hikerpig.cn/2014-03-26-web开发国内常用源/</link><guid isPermaLink="false">https://www.hikerpig.cn/2014-03-26-web开发国内常用源/</guid><pubDate>Sat, 14 Dec 2013 10:09:12 GMT</pubDate></item></channel></rss>