canvas 是 HTML5 提供的一个用于展示绘图效果的标签. canvas 原意画布, 帆布. 在 HTML 页面中用于展示绘图效果. 最早 canvas 是苹果提出的一个方案, 今天已经在大多数浏览器中实现.
自定义HEXO站内搜索Javascript+json
开始之前
目前很多Hexo博客都用的Swiftype和Algolia等第三方搜索服务。其实针对无数据库的情况下，Hexo本身也提供了两个插件来生成数据文件作为数据源：
hexo-generator-search生成xml格式的数据文件。
hexo-generator-json-content 生成json格式的数据文件。
今天的主角是hexo-generator-json-content，对于 Javascript语言来说还是解析 json 更方便，如果需要用 xml 做数据文件也可以使用已有的atom.xml。
神奇的视觉错觉现象
来源
下面是从MIT的Perceptional Science Group中的一个小分支Lightness Perception and Lightness Illusions里找到的几个十分经典的视觉错觉现象的动画演示。当然，我并不是闲着无聊来看这些玩意的。其实现在炒的火热的深度神经网络就是从模仿视神经网络的构造演变而来的。尤其是图像处理方面的网络，他的卷积和池化操作基本都是从视神经对图像进行处理的过程中得到的灵感。没事多研究研究视神经系统的现象，说不定还能让我们更好的理解人工神经网络呢。。。
示例
同时对比效应(The Simultaneous Contrast Effect)
康士维效应(The Cornsweet Effect)
交错错觉(The Criss-Cross Illusion)
模糊错觉(The Haze Illusion)
科尼尔-科斯腾错觉(Knill and Kersten’s Illusion)
考夫卡环(The Koffka Ring)
波状平地效应(The Corrugated Plaid)
不可能的台阶(Impossible Steps)
蛇形错觉(The Snake Illusion)
瓦萨雷里错觉(The Vasarely Illusion)
怀特错觉(White’s Illusion)
事实上，上面提到的这些错觉，有很多都可以作为反应视网膜侧抑制现象(lateral inhibition)的示例。所谓侧抑制现象，就是指视网膜上相邻感受器之间会存在相互抑制的现象，正是因为这个现象的存在，才导致了同样的一个图案，在不同环境的映衬下会给人不一样的感受。
当然，另外一种感性的理论认为，人的视觉系统是非常智能的，对于我们接受到的图案，视觉系统会预先进行视觉补偿处理。比如如果背景太暗，视觉系统会认为既然光线暗了，那么实际看到的物体就会变暗，因此我需要把他的亮度提高从而得到他真实的亮度。虽然个人觉得这个理论有点牵强附会的意思，不过用这个理论的确可以很自然的解释很多类似的现象。
swf转mp4+mp4转gif等格式的方法
前言
我们都知道swf文件（ShockwaveFlash的简称，读作swiff）在前几年是非常火的，由于他是基于矢量绘图的flash动画文件，他的图像效果，交互效果等都非常出色，而且文件本身还很小巧，尤其适合在网页端进行显示，以至于很多的演示视频，甚至小游戏都是用swf文件来保存的。不过近几年随着Html5的发展，他在移动端的优点渐渐消失，甚至很多浏览器也开始不支持flash插件。而且如果在电脑上运行还得额外安装flash player，很是麻烦。比如很多情况下，我们还是需要在网页中播放swf文件进行演示，或者将这个swf文件放到另外一台电脑中播放，这样我们还得搞定用户浏览器是否支持flash插件或者另外一台电脑是否安装了flash player。因此最方便的做法就是提前把swf文件转化为mp4视频文件进行播放，甚至是直接制作成动态图片的效果。
这个需求显然是存在的，那么有什么解决的办法呢？
方法一：在线格式转换&转换软件
无论是baidu，还是google，只要搜索类似”swf 转 mp4”之类的关键词，我们大概都能搜到很多在线转换的网站。当然，这些网站据称是能完美将swf转换成mp4等视频格式。然而当你真正试的时候才会发现，或许有的swf文件能正确转换，然而对大多数swf文件进行转换的时候我们就会发现，转换后的文件可能只会保留音频信息，我们只能看到一片漆黑。这是因为swf文件与mp4等流媒体文件有着本质的不同，因为他并是以完整的图片帧为播放单位的，很多情况下他以矢量图形块的形式进行保存的，然后对图形发出指令进行旋转啊位移之类的操作，甚至可以还接受用户的指令。而流媒体文件则完全是以帧的形式一帧一帧的向显示器发送图片。
比如对于某一个swf文件，我对他进行元素的提取：
1 | $ swfextract contrast-movie.swf |
我们可以发现他是由形状、字体等要件构成的，而一般的swf2mp4之类的在线转换器只能识别出其中的音频流部分，无法处理图像信息。因此这个方法基本是不适用的。
当然，网上也有很多类似的转换软件，但经我测试，是基本都是垃圾软件。。。甚至是格式工厂这类比较知名的软件，也无法完美处理swf的转换问题。
方法二：利用swfTools工具
ubuntu社区中集成了swfTools工具包（通过$sudo apt install swftools 进行安装即可），这个工具包里有很多对swf进行处理的命令，比如swfbbox、swfcombine swfextract、 swfstrings 、swfc、 swfdump、 swfrender，等一系列工具，包括了对swf进行编译、拆分、提取素材、提取音频、提取字体、查看信息等方法。其中swfrender命令就可以将swf提取成图片帧。
比如对我想将a.swf提取成图片帧，那我只要输入命令$swfrender a.swf ，就会一次生成很多个png图片，再对这些图片进行后期处理即可生成想要的内容。
虽然对于大多数swf还是能很好的处理成图片帧的，但是还是会有一些小问题，比如各个帧之间会存在干扰、帧的背景是透明的等问题。显然这个命令也不是很成熟(或者是我还不怎么会用)。。。
方法三：土方法
所谓土方法，就是最朴素的方法了，既然我不能直接转换，那我干脆就播放出来然后截屏好了。没错，这就是我捣鼓半天之后找到的最好的方法了。。。
ubuntu下播放swf的工具是swfdec-gnome，可以通过$ sudo apt install swfdec-gnome 的命令进行安装。
ubuntu下有一个很方便的录屏工具叫Kazam，可以通过$ sudo apt install kazam进行安装，
这个程序能够截取一小段窗口进行屏幕录制，并且可以选择是否带声音，非常方便。因此我们只要用 swfdec-gnome程序包中的Gnash SWF Viewer 打开swf文件，再进行录屏即可得到一个视频文件。
如果想把视频文件转换成gif格式的图片，我们只要再利用imagemagick的convert命令，将a.mp4文件转换成图片帧(注意图片名的格式控制)：
1 | convert a.mp4 out%03d.png |
这样我们就得到了依次标号的图片帧。再用convert命令将这些图片帧转换成gif图片即可:
$ convert *.png out.gif
当然，我们一般还要稍微优化压缩下，然后调解下帧率，通常会加下面的参数：
$ convert -delay 5 -layers Optimize *.png out.gif
这样一般就能得到我们想要的动图了。一般这样得到的gif图片也不会太大。
当然，我们也可以把这两步进行合并，一次性生成：
$ convert -delay 5 -layers Optimize a.mp4 out.gif
Gitbook电子书编写工具
简述
GitBook是一个非常酷的电子书编写工具，之前在学Git的时候就曾经接触过一个叫”ProGit”的电子书，我们可以在很多网站上都可以直接以静态网页的形式浏览他，比如这里和这里，非常的酷。与此同时，他还能够非常方便的翻译成各种不同的语言，非常便捷的进行文章的修改，并且能非常自然的融合进不同的网站。后来仔细一查，发现原来这本书本身就发布在Github上，并且用了一个特殊的工具进行处理，这个工具就是Gitbook。
当然，Gitbook也有自己的网站以及类似book repository的个人书籍存储仓库，不过显然大家更倾向于直接把书当成一个项目发布在Github上，方便分享。
个人认为如果大家都用GitBook来写文章，那么无论是对书籍的版本控制、格式控制、还是书籍的电子化存储、索引以及展示都将有非常大的帮助。更重要的是，在Github这样一个自由开放的平台共享书籍，势必能够促进知识的交流与传播，对整个人类而言都是一件非常有意义的事情。
文档
GitBook的官方文档在这里，对很多细节还是交代的非常详尽的，包括安装、文件含义、配置信息、导出PDF、导出静态页面、甚至还不厌其烦的再次解释了Markdown的用法。当然，为了能够方便我们使用MarkDown+Gibook+GitHub进行编写和版本控制，他们也发布了一个挺不错的编辑器，名字也叫GitBook，使用起来也是非常方便的:
不过使用GitBook进行编写的时候，一般要手动先gitbook init，git init，然后first commit 一下才能添加进来。
测试效果
下面就是照着教程搭建好环境后随便写的一个测试文档，可以看出来用他导出的pdf层次清晰、页面干净，导出的默认静态页面也非常清新：
默认导出的pdf:
可以看出他自动添加了索引、页眉页脚，版式也很漂亮。
默认导出的静态网页：
有索引，有字体调整，充分发挥了MarkDown简洁大方的特点。