Fing's Blog

DIY 搭建个人主页实录（一）

Sat, 24 Apr 2021 23:39:00 +0000

个人主页已经很久没有更新了，去年把博客迁移到 Hugo 之后，就一直想把个人主页也用 Hugo 重新搭建并简化，并稍微详细的记录一下整个搭建的过程。

如果能够跟着我的记录一步步做的话，完成之后可以得到下面的效果：

环境配置

主要用到的工具是 Hugo + Tailwind CSS：

Hugo：编译的速度非常快
Tailwind CSS：好看，并且用起来非常简单

Windows 用户推荐通过 Chocolatey 来安装所需的工具，macOS 用户则可以用 Homebrew 安装。关于 Chocolatey，更多可以参考这篇文章。

需要安装 Hugo 和 Node.js：

Windows：$ choco install hugo nodejs
macOS：$ brew install hugo node

初始化项目

首先，需要用 Hugo 新建一个新的空白站点，打开 Powershell 或 Terminal：

1

hugo new site homepage

按照提示会生成一个新的目录 homepage，接下来要在刚刚的目录里面初始化 npm 以及安装一些必要的包：

1
2
3


cd homepage
npm init -y
npm install tailwindcss@latest postcss-cli@latest autoprefixer@latest --save

之后初始化 Tailwind：

1

npx tailwindcss init -p

这个命令会创建 tailwind.config.js 和 postcss.config.js，从名字上可以判断它们是配置文件

打开 tailwind.config.js，修改 purge 部分为：

1
2
3


purge: {
content: ["./layouts/**/*.html", "./content/**/*.md", "./content/**/*.html"],
},

Hello Hugo

接着来做一个简单的 Hello Hugo 的网站。运行下面的命令，为的是在 Hugo 项目中新建一些基本的目录和站点文件：

1
2


mkdir -p assets/css layouts/_default
touch layouts/index.html layouts/_default/baseof.html assets/css/main.css

主要创建了 layouts 目录以及基本的页面结构：

layouts
├── _default
│   └── baseof.html
└── index.html

在这个目录里面，baseof.html 是基本的框架，index.html 是主页的构架。

先在 layouts/_default/baseof.html 里添加：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21


<!DOCTYPE html>
<html>
<head>
<title>{{ .Site.Title }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
{{ $styles := resources.Get "css/main.css" }}
{{ $styles = $styles | resources.PostCSS (dict "inlineImports" true) }}
{{ if hugo.IsProduction }}
{{ $styles = $styles | minify }}
{{ end }}
<link href="{{ $styles.Permalink }}" rel="stylesheet" />
</head>
<body>
{{ block "main" . }}{{ end }}
</body>
</html>

之后在 layouts/index.html 添加：

1
2
3


{{ define "main" }}
<h1 class="container mx-auto mt-5 text-3xl">Hello Hugo</h1>
{{ end }}

最后在 assets/css/main.css 中添上：

1
2
3


@tailwind base;
@tailwind components;
@tailwind utilities;

在终端里运行 hugo server 看看效果

构建主页

接下来看看如何构建一个页面，大致上将页面划分为两个主要部分，最上面是头部的导航栏，其余的内容放在另一个大的容器内

导航栏

给刚刚新建的页面加个导航栏，新建 layouts/partials 文件夹，这个目录里面之后会放一些小的部件。新建 layout/partials/header.html：

1
2
3
4
5
6
7
8
9


<header>
<nav class="flex flex-col sm:flex-row justify-between mb-12 mt-8" role="navigation">
<div>
<a href="/" class="text-lg font-bold">{{ .Site.Title }}</a>
</div>
</nav>
</header>

上面主要添加了一个大的可点击的标题，内容为站点 config.toml 中的 title 属性。在 index.html 中通过 Hugo 的 partial 关键词插入 header.html 的内容：

1
2
3
4
5
6
7
8
9


{{ define "main" }}
<div class="container max-w-2xl mx-auto">
{{- partial "header.html" . -}}
<h1 class="">Hello Hugo!</h1>
</div>
{{ end }}

之后要实现导航栏右侧的几个按钮，它们本质上是横向的列表。

修改刚刚的 header.html ：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


<header>
<nav class="flex flex-col sm:flex-row justify-between mb-12 mt-8" role="navigation">
<div>
<a href="/" class="text-lg font-bold">{{ .Site.Title }}</a>
</div>
<ul class="flex space-x-4">
{{ range .Site.Menus.main }}
<li>
<a href="{{ .URL | absURL }}">{{ .Name }}</a>
</li>
{{ end }}
</ul>
</nav>
</header>

{{ range .Site.Menus.main }} 会在 config.toml 中查找 [menu] 配置。在 config.toml 中，添加一些配置：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


# 顶部菜单
[menu]
[[menu.main]]
url = "/projects"
name = "Projects"
weight = 1
[[menu.main]]
url = "/about"
name = "About"
weight = 2

我们的导航栏基本就完成了，之后只需要更改配置文件即可添加其他的页面链接。

简介组件

接下来制作最上面的这样一个简介的组件，包括了照片、名字、社交网站链接等元素

把 profile.jpeg 照片放到 static/images 里面，在 layouts/partials下创建 profile.html：

1
2
3


<div class="flex mb-4">
<img src="images/profile.jpeg" alt="" class="rounded-full object-cover w-32 mr-8">
</div>

像引入 header.html 一样，在 index.html 引入：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


{{ define "main" }}
<div class="container max-w-2xl mx-auto">
{{- partial "header.html" . -}}
{{- partial "profile.html" . -}}
<h1 class="">Hello Hugo!</h1>
</div>
{{ end }}

之后加入右边的部分，需要用一个 div 容器，里面加入 Harry Porter 的标题和下面的简介：

1
2
3
4
5
6
7


<div class="flex mb-4">
<img src="images/profile.jpeg" alt="" class="rounded-full w-32 h-32 mr-8">
<div class="flex-row">
<h1 class="text-4xl font-medium">Harry Porter</h1>
<p>Student at Hogwarts School</p>
</div>
</div>

之后需要加入一些社交网站的图标，例如 GitHub、LinkedIn、Twitter 等。首先需要找到想要添加网站的 SVG 矢量图标，可以利用 Simple Icons 或者 Flaticon：

同样，和添加头像步骤一样，新建一个 static/icons 目录，并将下载的 github.svg 等图标放进去，再修改 profile.html：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15


<div class="flex mb-4">
<img src="images/profile.jpeg" alt="" class="rounded-full w-32 h-32 mr-8">
<div class="flex-row">
<h1 class="text-4xl font-medium">Harry Porter</h1>
<p>Student at Hogwarts School</p>
<div class="flex mt-2 mb-2">
<img src="icons/github.svg" alt="" class="w-6 mr-2">
<img src="icons/instagram.svg" alt="" class="w-6 mr-2">
<img src="icons/linkedin.svg" alt="" class="w-6 mr-2">
</div>
<p class="font-mono text-sm">harry (at) hogwarts (dot) edu</p>
</div>
</div>

效果：

主体部分

在完成了这一部分之后，接下来我们需要让主页的主体部分（也就是上面的 Hello Hugo!）部分能够显示 Markdown 文件的内容。我们需要创建 content/_index.md 文件，在里面加入任意内容，如 ## Hello Markdown，修改 layouts/index.html，加入 {{ .Content }}，这部分将会被替换成 Markdown 渲染后的内容

1
2
3
4
5
6


...
{{- partial "header.html" . -}}
{{- partial "profile.html" . -}}
{{ .Content }}
...

但是... 实际并没有把刚刚 content/_index.md 中的标题正确的格式渲染出来

这是因为 Tailwind CSS 默认是把这种标题的格式去掉了，要想重新给标题加上格式，需要额外的步骤。在搜索了一番之后，在官方文档里发现了 Typography 的插件。为了能够用这个插件，需要先安装：

1

npm install @tailwindcss/typography

之后在 tailwind.config.js 加入：

1
2
3
4
5
6


module.exports = {
...
plugins: [
require('@tailwindcss/typography'),
],
}

之后修改 layouts/index.html，给 {{ .Content }} 用 article 标签包裹，并加上 prose class：

1
2
3
4
5
6
7
8


...
{{- partial "header.html" . -}}
{{- partial "profile.html" . -}}
<article class="prose">
{{ .Content }}
</article>
...

到这一步就基本只需要修改 _index.md 就可以添加原来 90% 主页的内容了：

添加卡片

接下来尝试加入更复杂一些的组件，例如 Tailwind 文档演示的这个卡片：

稍作修改，尝试把这一段加入到 index.html 里刚刚添加的 <article> 之后：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17


...
</article>
<div class="max-w-2xl mx-auto bg-white rounded-xl shadow-md overflow-hidden my-8">
<div class="md:flex">
<div class="md:flex-shrink-0">
<img class="h-48 w-48 object-cover" src="/images/profile.jpeg">
</div>
<div class="p-8">
<div class="uppercase tracking-wide text-sm text-indigo-500 font-semibold">Case study</div>
<a href="#" class="block mt-1 text-lg leading-tight font-medium text-black hover:underline">The Making of Harry Potter's Wand</a>
<p class="mt-2 text-gray-500">Harry's wand was broken in 1997, but was repaired by him after the 1998 Battle of Hogwarts. </p>
</div>
</div>
</div>
...

效果还可以，只是白色的背景和卡片的背景融为了一体

为了更好的区分，一种方法是在layouts/_default/baseof.html 给 <body> 加上浅灰的背景色：

1
2
3


...
<body class="bg-gray-100">
...

提取卡片组件

但如果我们想添加若干个上面的卡片的话，就需要将那一大段代码复制若干遍，并且将来想要修改这个卡片的样式，也需要一个一个修改。

这时候我考虑将卡片提取成组件，每次用的时候只需要提供图片路径、标题文字和介绍文字。可以利用 Hugo 的 Shortcodes 实现这一点。创建 layouts/shortcodes/project-card.html 文件，先添加简单的一行：

1

This is project card shortcode.

在 content/_index.md 中使用上面的 Shortcode：

1
2
3
4


...
## Projects

{{< project-card >}}

可以看到右边对应的地方出现了 project-card.html 里的内容

之后把上面的卡片代码复制到 layouts/shortcodes/project-card.html

结果发现在不一样的地方显示的卡片效果不一样。导致这个问题的原因是之前引入用来渲染 Markdown 的 @tailwind/typography 的 prose 类给这个卡片添加了一些额外的样式，造成文字、图片的边距不太一样了。在这里找到了问题的解决方法，修改 tailwind.config.js：

1
2
3
4


module.exports = {
important: "html",
purge: {
...

在 layouts/index.html 中，给 article 添加 max-w-none 样式来取消最大宽度的限制，这样卡片就能填充满整个横向的空间：

1
2
3


 <article class="prose max-w-none">
{{ .Content }}
</article>

之后在 project-card.html 中的 img 上增添 m-0 属性，表示外边距为 0，在最后的 p 元素加上 mb-0 将底部边距设为 0，给 a 元素添上 no-underline 来取消下划线效果

1
2
3
4
5
6


...
<img class="h-48 w-48 object-cover m-0" src="/images/profile.jpeg">
...
<a href="#" class="block mt-1 text-lg leading-tight font-medium text-black hover:underline">The Making of Harry Potter's Wand</a>
<p class="mt-2 text-gray-500 mb-0">Harry's wand was broken in 1997, but was repaired by him after the 1998 Battle of Hogwarts. </p>
...

删除 layouts/index.html 中的卡片部分。接着修改 Shortcode 的模板，让不同的部分能够通过参数来修改。

给组件添加参数

参照官方文档的这个例子，修改 img 标签的 src 部分为 {{ .Get "img" }}，花括号的部分会被替换为 {{< project-card img="xxx" >}} 中的 xxx

1
2
3


...
<img class="h-48 w-48 object-cover m-0" src="{{.Get "img" }}">
...

修改 content/_index.md 中的 Shortcode 为：

1

{{< project-card img="images/profile.jpeg" >}}

保存之后应该会看到正确显示的图片。接着修改 layouts/shortcodes/project-card.html，去掉 Case Study 那一行（没啥用），将 a 中的内容改为 {{ .Get "title" | absURL }}，将 p 改为 div 并改标签内容为 {{ .Inner | markdownify }} 来展示 Markdown 内容

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


<div class="max-w-2xl mx-auto bg-white rounded-xl shadow-md overflow-hidden my-8">
<div class="md:flex">
<div class="md:flex-shrink-0">
<img class="h-48 w-48 object-cover m-0" src="{{ .Get "img" | absURL }}">
</div>
<div class="p-8">
<a href="#" class="no-underline block mt-1 text-lg leading-tight font-medium text-black hover:underline">{{ .Get "title" }}</a>
<div class="mt-2 text-gray-500 mb-0">{{ .Inner | markdownify }}</div>
</div>
</div>
</div>

之后可以在 content/_index.md 中这样使用：

1
2
3


{{< project-card img="images/profile.jpeg" title="The Making of Harry Potter's Wand" >}}
Harry's wand was broken in 1997, but was repaired by him after the *1998 Battle of Hogwarts*.
{{< project-card >}}

Nice，中间的文字部分甚至能用 Markdown

至此就基本完成了个人主页的搭建，之后想要修改主页的话只需修改 _index.md 中的内容。

添加项目页面

接着尝试添加 Projects 页面，新建 layouts/projects/list.html 模板文件，将 layouts/index.html 的内容复制过去，去掉 profile 那一行：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


{{ define "main" }}
<div class="container max-w-2xl mx-auto">
{{- partial "header.html" . -}}
<article class="prose max-w-none mb-8">
{{ .Content }}
</article>
</div>
{{ end }}

新建 content/projects/_index.md 文件，可以继续利用 project-card 组件：

这时候可能你会想给某个项目创建一个页面，用来展示具体的项目细节，点击项目卡片的标题即可进入到这个页面。先创建 layouts/projects/single.html 文件，接着将 layouts/projects/list.html 的内容复制到 single.html 中。创建 content/projects/hello.md，我们将在其中添加一些内容：

1
2
3


## Project Hello

This is an example

接着访问 localhost:1313/projects/hello/

对于项目卡片，需要修改 Shortcode 模板来增添额外的参数使得点击标题能够跳转到这个页面。修改 project-card.html：

1
2
3


...
<a href="{{ .Get "url" | absURL }}" class="no-underline block mt-1 text-lg leading-tight font-medium text-black hover:underline">{{ .Get "title" }}</a>
...

在 content/projects/_index.md 中，给其中一个 project-card 添加 url="projects/hello" 即可。

优化移动端

上面的页面在电脑上浏览的效果还不错，来看看在手机这种屏幕比较窄的设备上怎么样，按 F12 打开 Chrome 开发者工具，在左上角切换移动设备：

在 iPhone 上的显示效果大致如上，可以看到主要的问题是页面左右两边内边距没有设置好。通过把鼠标放在右边树状的 HTML 标签上，可以确定需要在 body 下第一个 div 添加 padding：px-6 md:px-0。其中 px-6 表示 X轴方向，也就是左右的 padding 为 6 个单位，后面的 md:px-0 表示在中等尺寸及更大的屏幕上，则设置左右页边距为 0：

1
2


<div class="container max-w-2xl mx-auto px-6 md:px-0">
...

项目卡片也需要进一步修改：

将 layouts/shortcodes/project-card.html 中的 <img> 标签里的 w-48 替换为 w-full md:w-48，表示默认宽度 w(idth) 为 full，也就是填充整个横向部分，在大屏幕宽度则固定为 48 个单位：

总结

这篇文章记录了：

初始化 Hugo 项目及添加 Tailwind CSS
搭建基本的主页结构，
创建单独 Projects 页面
为手机移动端优化页面样式

下一篇文章，将介绍如何进一步优化该网站的内容和样式，以及和如何部署网站。

相关链接：

在网页中嵌入 Plotly 交互式图表

Tue, 13 Apr 2021 23:39:00 +0000

Plotly 是一个开源的 Python 可视化图表库，能够生成高质量的可交互式图表。在生成了图表之后，把它放到网站上展示给其他人又是一个头疼的问题。这里分享一下我是如何导出 Plotly 图表并能够灵活的嵌入到任意网站的方法。

创建 Plotly 交互图表

接下来将要在 Google Colab 演示如何创建一个 Plotly 图表。Google Colab 是一个在线免费的 Jupyter 运行环境，能够省去我们配置 Python 环境的麻烦。

新建一个 Notebook，我们需要安装一些 Python 的包来使后面的例子能够顺利的运行：

1
2


!pip install geopandas pyshp shapely plotly-geo
!pip install plotly --upgrade

接下来以一个美国的地图为例：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


from urllib.request import urlopen
import json
with urlopen('https://raw.githubusercontent.com/plotly/datasets/master/geojson-counties-fips.json') as response:
counties = json.load(response)
import pandas as pd
df = pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/fips-unemp-16.csv", dtype={"fips": str})
import plotly.express as px
fig = px.choropleth(df, geojson=counties, locations='fips', color='unemp',
color_continuous_scale="Viridis",
range_color=(0, 12),
scope="usa",
labels={'unemp':'unemployment rate'}
)
fig.update_layout(margin={"r":0,"t":0,"l":0,"b":0})
fig.show()

上面的代码运行之后可以得到这样的效果：

我们将鼠标放在上面，能够看到每个县的数据，用鼠标滚轮也还能放大缩小整个地图。这样子我们就得到了这样一个示例的交互图表。那有没有办法能够将它分享出去呢？

导出 Plotly 图表到 HTML

接下来要做的事是把刚刚绘制的图表导出成网页的格式，也就是 HTML。参照官方文档里的 Interactive HTML Export in Python：

1

fig.write_html("map.html")

我们可以在左边的文件浏览窗口看到刚刚生成的 map.html 网页文件。但上面的代码生成的 HTML 文件体积通常偏大，因为它把 Plotly 的整个 Javascript 脚本库都集成了进去。我们可以通过设置 include_plotlyjs 参数来控制它的大小：

1

fig.write_html("map.html", include_plotlyjs="cdn")

通过设置 CDN 的方式引入 Plotly 库，map.html 的大小缩小至了 4M。

下面问题来了，将这个 map.html 直接整个插入到其他网页的代码是比较困难，也会造成整个网页加载速度变慢。

在下面展示的一篇 WIRED 文章就用到了 Plotly 的交互图表，它是通过了 iframe 的方式将图表所在的网页嵌入。

这种方法通俗来说就是在网页中放一个小浏览器，再将另一个网站的页面加载进来。

想要实现这个的关键步骤是把我们刚才生成的 Plotly 图表变成一个可访问的网站链接。一个简单又免费的方法就是通过 GitHub Pages。

上传图表创建 GitHub Pages

首先新建一个公共仓库，之后将刚刚生成的 map.html 重命名为 index.html 并上传到刚刚创建的仓库：

选择文件之后直接点击 Commit Changes。之后在 Settings 里面找到 Pages 页面，选择 Source 为 main：

选择 Save 之后，就会有成功的通知，打开那个链接确认能够看到你的 Plotly 图表。

如果需要更新你的图表的话，只需要更新仓库中的 index.html 文件即可，重新打开上面的链接并刷新就能看到更新后的图表了。

创建 iframe

接着我们就可以利用上面创建的网址链接：

1
2
3
4


<iframe scrolling="no" style="border:none;" seamless="seamless"
src="https://mtobeiyf.github.io/plotly-map-demo/"
height="400" width="100%">
</iframe>

只需将 src 部分替换成你的链接即可，同时可以通过 height 和 width 参数调整长宽。上面的一段 HTML 代码可以放到像 WordPress 的文章中，也可以放在任意的 HTML 或 Markdown 的文章中。

下面是效果展示，将鼠标放上去就可以和图表交互：

链接：

利用 RSS 高效获取信息

Sat, 06 Mar 2021 23:39:00 +0000

信息碎片化的今天，想要获取优质信息变得非常困难：我们需要耗费很多时间访问不同的网站和手机客户端去追踪即时的资讯，与此同时也会被应用自己的推荐信息流分散注意力。

什么是 RSS

RSS 的全称是 Really Simple Syndication，网站通常会生成 RSS Feed 文件，每当站点发布新的内容时，都会在这个文件中生成新内容的摘要等信息。因此仅需通过访问网站上的这个固定地址的文件，我们就能够得到当前网站的新内容更新信息。

下面是 The Verge 的 RSS Feed 的示例：

RSS 是十几二十年前的东西，曾经一度在 Google 宣布关闭 Google Reader 时被“宣告死亡”。但最近几年，随着社交媒体的普及以及信息的爆炸，RSS 又重新回到一些人的视野。通过 RSS，我们就能够订阅自己想要的站点更新，将信息聚合，能够更加有效率阅读和处理信息流。

RSS 客户端

目前有很多方式能够通过 RSS 订阅你想要的资讯，有网页版的、也有手机电脑客户端。这些软件或者网站应用的使用方式都非常简单，只需要把你需要订阅的 RSS 链接加入进去就行了。

我目前在用的 RSS 客户端是 Reeder 5，最新的版本 5 支持了 iCloud 同步，你就不再需要第三方的网站服务，直接由 Reeder 在你的 Mac、iPad 和 iPhone 之间同步阅读进度及内容。

可惜的是 Reeder 是需要付费的，那么免费的替代品可以考虑开源的 NetNewsWire，目前也正在测试 iCloud 同步功能。将来等新版本的 Mac 和 iOS 客户端发布，是完全能够用作日常主力的 RSS 阅读器。

除了电脑客户端，你也可以选择一些网站管理自己的 RSS 订阅源，并直接在网站里阅读。对于网页端的选择，Inoreader 的免费 Plan 就足够大多数人的日常订阅需求。当然，免费随之而来的缺点是：有广告，以及订阅源的刷新不是非常及时，想要更好的体验，就得付费购买更高级的 Plan。

Feedbin 是另一个非常优秀的网页 RSS 阅读器，界面简约，还支持订阅 Twitter，以及提供虚拟邮箱订阅一些通过邮件更新的站点。

值得一提的是，Reeder 和 NetNewsWire 都支持订阅 Feedbin 和 Inoreader，这样你可以在手机平板、网页、电脑端多个设备间同步阅读的进度。不过，在Reeder 5 支持 iCloud 同步内容之后，再使用网页阅读器就略显多余了。

订阅信息

要获取网站的 RSS 链接，最常用的就是直接 Google 网站名称加上 RSS 关键词。一般的个人博客，或者用 WordPress 搭建的资讯站点，都会提供 RSS Feed 的链接，不过像一些大型的商业付费资讯，不一定会有 RSS Feed。

同样我们可以利用 RSS 订阅 YouTube 频道或播放列表，这样一来我们就不需要点开 YouTube 来追踪我们喜欢的频道的最新视频了。我们以小高姐的 Magic Ingredients频道为例，它的链接是：

https://www.youtube.com/channel/UCCKlp1JI9Yg3-cUjKPdD3mw

其中 channel 后面的一长串是 Channel ID，将那一串粘贴到

https://www.youtube.com/feeds/videos.xml?channel_id= 最后面就可以得到 RSS 的订阅链接了：

https://www.youtube.com/feeds/videos.xml?channel_id=UCCKlp1JI9Yg3-cUjKPdD3mw。

下面是在 Reeder 5 上面订阅 YouTube 频道的示例。这里需要注意的是，不同的软件对 YouTube 视频的支持是不一样的，有些可能只能显示标题，没法像 Reeder 一样内嵌视频。同样，也可以通过类似的方法订阅一个播放列表，只需使用下面的地址：

https://www.youtube.com/feeds/videos.xml?playlist_id=

订阅 Reddit 的话，以 r/MachineLearning 为例，仅需在它的地址后加上 .rss 即可：

https://www.reddit.com/r/MachineLearning.rss

对于像 Twitter 的社交媒体来说，得指望第三方的服务从 Twitter 抓取内容，然后生成对应的 RSS Feed。之前提到的 Feedbin 支持订阅 Twitter，免费的解决方案可以采用社交媒体 | RSSHub 提供的接口：

https://rsshub.app/twitter/user/elonmusk

对于这类需没有直接提供 RSS 的信息源，可以看看开源的介绍 | RSSHub 项目，里面包括了非常多开箱即用的 RSS 订阅链接。

写在最后： RSS 只是一种便捷的聚合信息的方式，对于经常关注各种各样新闻、油管频道、博客站点的人来说，通过 RSS 订阅的方式，能够非常便捷的获取及时的更新。当然，RSS 也有诸多限制，但这也不妨碍我们尝试使用 RSS 来管理我们的信息流。

链接：

Raft 实验 Part C 总结回顾

Sun, 11 Oct 2020 23:39:00 +0000

在 MIT 6.824 分布式系统课程中，第二个实验是实现分布式共识算法 Raft，分成了 A/B/C 三个部分。之前的 A 和 B 部分实现了 Raft 中的领导选举（Leader election）和日志复制（Log replication），第 C 部分将会实现保存持久状态（Persistent State）。

Part 2A 和 Part 2B 部分基本已经把整个 Raft 的框架搭好了。如果基于Raft的服务器重新启动，则应从中断的位置恢复服务。这就要求 Raft 保持持久状态，使其在重启后仍然有效。论文的 Figure2 提到了哪些状态应该保持不变。

前两部分文章链接：

实验部分

Persistent State

论文图 2 直接告诉了我们 Persistent state on all servers: currentTerm、votedFor 和 log[]。在这个部分里面，我们不需要负责把数据写到磁盘上的文件里，而是只需要通过 Persister 对象实现 persist() 和 readPersist() 函数保存和恢复状态。

1
2
3
4
5
6
7
8
9


func (rf *Raft) persist() {
// Your code here (2C).
 w := new(bytes.Buffer)
e := labgob.NewEncoder(w)
e.Encode(rf.currentTerm)
e.Encode(rf.votedFor)
e.Encode(rf.log)
rf.persister.SaveRaftState(w.Bytes())
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


func (rf *Raft) readPersist(data []byte) {
if data == nil || len(data) < 1 {
return
}
// Your code here (2C).
 r := bytes.NewBuffer(data)
d := labgob.NewDecoder(r)
d.Decode(&rf.currentTerm)
d.Decode(&rf.votedFor)
d.Decode(&rf.log)
}

基本按照原来注释里的例子写就可以了。如果想实现的更好一些，也可以再定义一个结构体。注意在开头要 import "../labgob"

那么现在问题来了，该在哪些地方调用 persist() 和 readPersist() 呢？直觉告诉我们当上面提到的三个状态（currentTerm、votedFor 和 log[]）改变了就应该进行持久化。回顾一下之前的实现：

Make() 会在 Raft 实例被初始化的时候调用，因此这里会用到 readPersist() 来读取先前保存好的状态
Leader 在 Start() 函数里可能会更新自己本地的 log，需要 persist()
当 Raft 转变为 Candidate 和 Follower 的时候，currentTerm 和 votedFor 都可能发生变化，因此在相应地方加上 persist()
RequestVote 和 AppendEntries 函数同样也会改变状态，最后也需要 persist()

如果以上都完成了，Part C 的前几个基本测试就能够通过。

Back up nextIndex Optimization

不过还有几个 unreliable 的测试是没法通过的。这里我花了很久的时间去 Debug，因为理论上按 Figure 2 把所有的细节实现好了，那么 Figure 8 的问题是不会再出现的。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


Test (2C): Figure 8 (unreliable) ...
--- FAIL: TestFigure8Unreliable2C (41.11s)
config.go:475: one(4800) failed to reach agreement
Test (2C): churn ...
--- FAIL: TestReliableChurn2C (26.33s)
config.go:475: one(7825959370052427039) failed to reach agreement
Test (2C): unreliable churn ...
--- FAIL: TestUnreliableChurn2C (26.18s)
config.go:475: one(1988810278690071914) failed to reach agreement
FAIL

后来又读了一遍实验要求，发现这么一条 Hint：

You will probably need the optimization that backs up nextIndex by more than one entry at a time. Look at the extended Raft paper starting at the bottom of page 7 and top of page 8 (marked by a gray line). The paper is vague about the details; you will need to fill in the gaps, perhaps with the help of the 6.824 Raft lectures.

简而言之就是在之前的实现里面，每次当 AppendEntries 因为不一致的 log 而返回 false 时，我们只让 nextIndex 往回退了一个位置。对于有很多不一致的 entry 的话这样做显然不够 efficient。因此需要优化这一步骤，具体的做法是在 AppendEntriesReply 结构中增加一个 conflictIndex 项。

如果 Follower 没有 prevLogIndex 那一项，即 Follower log 长度不够，那么 conflictIndex = len(log)。具体可以看 Student's Guide to Raft，他同时用了 conflictIndex 和 conflictTerm，这里我偷懒了，最好要补上。之后 decrement nextIndex and retry 那一步改写成：

1
2
3
4
5
6
7
8
9


// If last log index ≥ nextIndex for a follower: send
// AppendEntries RPC with log entries starting at nextIndex
// • If successful: update nextIndex and matchIndex for follower (§5.3)
// • If AppendEntries fails because of log inconsistency:
// decrement nextIndex and retry (§5.3)
if reply.Success {
} else {
rf.nextIndex[server] = reply.conflictIndex
}

测试

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20


➜ raft git:(lab2) ✗ go test -run 2C
Test (2C): basic persistence ...
labgob warning: Decoding into a non-default variable/field int may not work
... Passed -- 3.4 3 308 64734 6
Test (2C): more persistence ...
... Passed -- 18.7 5 2364 413576 16
Test (2C): partitioned leader and one follower crash, leader restarts ...
... Passed -- 2.1 3 82 18519 4
Test (2C): Figure 8 ...
... Passed -- 26.8 5 26948 6112820 14
Test (2C): unreliable agreement ...
... Passed -- 3.5 5 228 80581 246
Test (2C): Figure 8 (unreliable) ...
... Passed -- 27.9 5 3900 21820584 132
Test (2C): churn ...
... Passed -- 16.2 5 1204 1825170 696
Test (2C): unreliable churn ...
... Passed -- 16.3 5 1755 1290154 72
PASS
ok _/src/raft 117.704s

总结回顾

Raft 简明扼要，比较好懂，但是实现起来要注意的细节非常多，得把 Figure 2 仔仔细细的看完并且实现每一个部分。因为是分布式的系统，Raft 调试起来也会有不小的麻烦，Youtube 上的这节课 Lecture 5: Go, Threads, and Raft 对调试会提供不少的帮助，后半段视频也提供了 Leader Election 部分思路。

这门课以前 TA 写的 Student's Guide to Raft 非常详细的解释了 Raft 实现中的一些注意点，非常有用。我在写完了整个 Lab 之后才看，发现很多坑和理解了很久的部分，这篇文章都有所涉及。甚至对于一些具体的细节也解释的非常清楚，强烈推荐看一下。

参考

Raft 实验 Part B - MIT 6.824 Lab 2

Mon, 05 Oct 2020 18:28:23 +0000

在 MIT 6.824 分布式系统课程中，第二个实验是实现分布式共识算法 Raft，分成了 A/B/C 三个部分。我之前完成了 Part 2A，即 Raft 中的领导选举（Leader election）。实验 Part 2B 的主要实现日志复制（Log replication）的机制。

在熟悉和完成了 Part 2A 部分之后，Part 2B 的部分只需要在 2A 的基础上完善相应的逻辑，更容易直接上手，不过调试还是一个非常头疼的事情，因此在实现每个部分的时候，写好相应的注释以及输出相关的调试信息是非常重要的。

实验部分

在 Raft 的论文中，Figure2 很好的描述了整个 Raft 算法的细节。所有的实现都需要按照这个图上的指示来，不能偷懒。

Leader Election

先来回顾一下选举机制的实现：

初始化后用 Goroutine 执行 LeaderElection()，它是一个无限循环，通过 time.Sleep 实现选举超时检测，如果超时则开始新一轮选举 AttemptElection()
在 AttemptElection 中，将自己设为候选者，并向其它服务器发送 RequestVote RPC，若票数超过一半则转为 Leader，开始 LeaderOperation
在 LeaderOperation 中，定时向其它服务器发送心跳包，心跳包通过 AppendEntries RPC 处理

Log Replication

当 Leader 的 Start(command) 调用之后，立即向它自己的 log 末尾添加一个新 entry，更新各种 index
Leader 需要不断向其它服务器发送心跳包，直接在心跳包处理逻辑 AppendEntries 里实现日志复制的逻辑
当 Follower 在 AppendEntries 接受到参数之后，需要将它自己和 Leader 的 log 保持完全一致。一种情况是该 Follower 已经有了之前完整 log，只需添加新的 entry；另一种情况则是该 Follower 的 log 不完整或者有错误，则直接返回失败，Leader 检测到失败之后会将 nextIndex[index] 往前移动一位，如此反复直到 Follower 将所有不一致的 entry 删除并将缺失的 log 添加到末尾
当 Leader 得知 Follower 同步成功之后，和选举一样，如果超过半数的 matchIndex 都大于当前的 commitIndex，表明有新的 entry commit 成功了，需要更新 commitIndex
当 commitIndex 更新后，还需要通知 applyCh，将 [lastApplied, commitIndex] 区间里的所有 entry 都以 ApplyMsg 的结构体传送到 applyCh 中，最后再更新 lastApplied

Pseudocode

日志结构体可以直接按照图中的描述，这里我按照文章 5.3 小节加上了 Index 项保存在日志中的序号。注意日志的序号是从 1 开始，而存储的数组的下标是从 0 开始。

1
2
3
4
5


type LogEntry struct {
Command interface{} // command for state machine
 Term int // when entry is received by leader
 Index int // index in the LogEntry
}

首先，在 Make() 函数中，需要初始化 nextIndex 和 matchIndex 数组。在 Go 中，初始化一个给定长度的数组并赋值为 0 用 make([]int, len)。此外，还需要在 Raft 结构中将 applyCh 保存下来，这样每当 commit 一个新的 log，需要向 applyCh 发送一个 ApplyMsg 消息，否则是无法通过测试的。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


func Make(peers []*labrpc.ClientEnd, me int,
persister *Persister, applyCh chan ApplyMsg) *Raft {
// ...
 rf.applyCh = applyCh
rf.nextIndex = make([]int, len(peers))
rf.matchIndex = make([]int, len(peers))
go rf.LeaderElection()
//...
 return rf
}

接下来处理 Start() 函数，该函数尝试将传入 command 写入 Raft 的日志中。注释中提示了该函数应当立即返回，因此这里并不需要非常复杂的逻辑，先更新 term 和 isLeader，如果不是 Leader 就直接返回（此时 index 为 -1），如果当前实例是 Leader，那么直接 append 一个新的 LogEntry，将其序号赋值给 index 变量，并更新 nextIndex 和 matchIndex，然后直接返回。

虽然这个函数添加了一个新的 LogEntry 到它的日志末尾，但其它的 Raft 实例并没有达成共识，我们之后需要在 AppendEntries RPC 中实现日志复制的完整逻辑。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


func (rf *Raft) Start(command interface{}) (int, int, bool) {
// ... Remember to Lock()
 term = rf.currentTerm
isLeader = rf.state == Leader
if isLeader {
rf.log = append(rf.log, LogEntry{Command: command, Term: term, Index: len(rf.log) + 1})
index = len(rf.log)
rf.nextIndex[rf.me] = index + 1
rf.matchIndex[rf.me] = index
}
return index, term, isLeader
}

接着来看 AppendEntries RPC，在 Part 2A 中这个函数被用来处理心跳包，我们只需要在心跳包之后加上关于日志复制的逻辑，基本和 Figure 2 的 Receiver Implementation 的 5 点是一模一样的。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33


func (rf *Raft) AppendEntries(args *AppendEntriesArgs, reply *AppendEntriesReply) {
rf.mu.Lock()
defer rf.mu.Unlock()
rf.lastReceive = time.Now()
reply.Term = rf.currentTerm
// 1. Reply false if term < currentTerm (§5.1)
 // Switch to Follower if newer term found

// 2. Reply false if log doesn't contain an entry at prevLogIndex
 // whose term matches prevLogTerm (§5.3)

// rf.log doesn't contain entry at PrevLogIndex
 // reply false and return

// 3. If an existing entry conflicts with a new one (same index
 // but different terms), delete the existing entry and all that
 // follow it (§5.3)

// term at PrevLogIndex disagree with PrevLogTerm
 // reply false and return

// 4. Append any new entries not already in the log

// 5. If leaderCommit > commitIndex, set commitIndex =
 // min(leaderCommit, index of last new entry)

// after updating commitIndex, send ApplyMsg if commitIndex > lastApplied
 // update lastApplied

reply.Success = true
}

上面的 AppendEntries 是用来处理心跳包请求的，发送心跳包的函数需要加上处理逻辑。能够发送心跳包的只有 Leader，因此按照 Figure 2 中 Rules for Server Leader 部分实现。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48


func (rf *Raft) SendHeartbeat(server int) {
rf.mu.Lock()
var prevLog LogEntry
if rf.nextIndex[server] > 1 {
prevLog = rf.log[(rf.nextIndex[server]-1)-1]
}
entries := make([]LogEntry, len(rf.log)-prevLog.Index)
copy(entries, rf.log[prevLog.Index:])
args := AppendEntriesArgs{
Term: rf.currentTerm,
LeaderId: rf.me,
PrevLogIndex: prevLog.Index,
PrevLogTerm: prevLog.Term,
Entries: entries,
LeaderCommit: rf.commitIndex,
}
reply := AppendEntriesReply{}
rf.mu.Unlock()
ok := rf.sendAppendEntries(server, &args, &reply)
rf.mu.Lock()
defer rf.mu.Unlock()
rf.lastReceive = time.Now()
// Convert to Follower if reply.Term is newer

// If last log index ≥ nextIndex for a follower: send
 // AppendEntries RPC with log entries starting at nextIndex
 // • If successful: update nextIndex and matchIndex for follower (§5.3)
 // • If AppendEntries fails because of log inconsistency:
 // decrement nextIndex and retry (§5.3)
 if reply.Success {
// Update nextIndex and matchIndex
 // ...

// If there exists an N such that N > commitIndex, a majority
 // of matchIndex[i] ≥ N, and log[N].term == currentTerm:
 // set commitIndex = N (§5.3, §5.4).
 } else {
// decrement nextIndex
 rf.nextIndex[server] = prevLog.Index
}
}

在 AttemptElection 函数中，需要修改 RequestVoteArgs，将 LastLogIndex 和 LastLogTerm 的值放进去，在 Candidate 得到足够的选票后，重新初始化 nextIndex 和 matchIndex。

在 RequestVote 处理函数中，需要加入判断 Candidate 的 log 是否比接收者的更新，确保 Leader 拥有最新的日志，否则设置 reply.voteGranted=false。

每一次更新完 commitIndex 后，如果 commitIndex 比 lastApplied 更新，说明要向 applyCh 发送最新被 commit 的 entry 信息。在 AppendEntries 和 SendHeartbeat 都有可能更新 commitIndex，因此都需要调用该函数。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


func (rf *Raft) sendApplyMsg() {
// If commitIndex > lastApplied: increment lastApplied, apply
 // log[lastApplied] to state machine (§5.3)
 if rf.commitIndex > rf.lastApplied {
entries := append([]LogEntry{}, rf.log[rf.lastApplied:rf.commitIndex]...)
go func(entries []LogEntry) {
for _, entry := range entries {
msg := ApplyMsg{
CommandValid: true,
Command: entry.Command,
CommandIndex: entry.Index,
}
rf.applyCh <- msg
rf.mu.Lock()
if rf.lastApplied < msg.CommandIndex {
rf.lastApplied = msg.CommandIndex
}
rf.mu.Unlock()
}
}(entries)
}
}

测试

可以通过 $ go test -run TestBasicAgree2B 来运行其中的一个测试

整个 Part 2B

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


➜ raft git:(lab2) ✗ go test -run 2B
Test (2B): basic agreement ...
... Passed -- 1.0 3 16 4290 3
Test (2B): RPC byte count ...
... Passed -- 2.6 3 48 113518 11
Test (2B): agreement despite follower disconnection ...
... Passed -- 5.5 3 96 25251 7
Test (2B): no agreement if too many followers disconnect ...
... Passed -- 3.7 5 168 38812 3
Test (2B): concurrent Start()s ...
... Passed -- 0.8 3 14 3786 6
Test (2B): rejoin of partitioned leader ...
... Passed -- 4.6 3 140 34273 4
Test (2B): leader backs up quickly over incorrect follower logs ...
... Passed -- 38.5 5 2634 2335471 106
Test (2B): RPC counts aren't too high ...
... Passed -- 2.2 3 40 11214 12
PASS

写在最后

这部分实验调试占了绝大部分时间，用工程里面提供的 DPrintf 会非常方便
代码需要严格按照 Figure 2 的逻辑实现，具体细节可以阅读 5.3 节帮助理解
Go 的 for range 要注意是值还是 index

最好显式的写成 for _, value := range Collection ...
JetBrains 的 GoLand 非常好用，学生可以免费获得授权

参考：

Raft 实验 Part A - MIT 6.824 Lab 2

Fri, 11 Sep 2020 18:28:23 +0000

在 MIT 6.824 分布式系统课程中，第二个实验是实现分布式共识算法 Raft。这个实验分成了 A/B/C 三个部分，这篇将主要围绕 Part 2A 部分的实验介绍一下 Raft 的基本概念和实现 Raft 中的领导选举（Leader election）。

Raft

在 Raft 之前，比较著名的共识算法是 Paxos，据说非常难懂。提出 Raft 目的之一就是使其易于理解。

共识（Concensus）是容错分布式系统中的一个基本问题。共识涉及多个服务器就操作达成一致。一旦他们对某个操作做出决定，该决定就是最终决定。当大多数服务器可用时，典型的共识算法会取得进展。例如，即使 2 台服务器出现故障，包含 5 台服务器的群集也可以继续运行。如果更多服务器发生故障，它们将停止前进（但绝不会返回错误的结果）。

在分布式系统中，复制服务（replicated service）通常将其状态（即数据）的完整副本存储在多个副本服务器（replica server）上来实现容错功能。即使服务的某些服务器出现故障（崩溃，网络故障或不稳定），剩下的副本服务器也可以使服务继续运行。挑战在于，故障可能导致副本服务器持有不同的数据副本。

Raft 将客户请求组织成一个序列，称为日志，并确保所有副本服务器看到相同的日志。每个副本均按日志顺序执行客户端请求，并将其应用于服务状态的本地副本。由于所有活动副本都具有相同的日志内容，因此它们都以相同的顺序执行相同的请求，因此继续具有相同的服务状态。如果服务器出现故障但后来又恢复了，Raft 会确保其日志为最新状态。只要至少大多数服务器处于活动状态并且可以相互通信，Raft 就会继续运行。如果没有这样的多数，Raft 将不会取得进展，但是一旦多数能够再次交流，它将从中断的地方继续前进。

更多的细节可以前往 Raft Paper。

实验部分

这里将讨论 6.824 Lab 2: Raft 的 Part 2A，这一部分是实现 Raft 中的领导选举机制。因为这是第一部分，所以实现起来会有一些无从下手，而且代码本身是 concurrent 的，所以调试也会比较困难。主要的代码都在 raft/raft.go 中。

在 Raft 的论文中，Figure 2 很好的描述了整个 Raft 算法的细节。接下来先梳理一下 Leader Election 的逻辑。

首先，一个 server 会有三种状态：Follower、Candidate 和 Leader。最开始的时候，所有的 server 的状态都为 Follower。对于每个 server，会初始化一个随机的选举超时时间（election timeout)，那么当一个 server 在这段时间里面没有收到来自 Candidate 或 Leader 的消息时，便将自己转变为 Candidate 并开始新一时期（Term）选举。Candidate 通过向其它 server 索取选票（Vote），得到半数以上便转变为 Leader。之后便定时向其它服务器发送心跳包（Heartbeat）来防止新的选举。

代码主要思路：

所有状态都通过 Raft 结构体管理
Make() 函数初始化所有状态变量，并通过 Goroutine 启动 LeaderElection()，监测选举超时
如果在规定时间内没有没有接收到其它服务器的消息请求，尝试选举 AttemptElection()
在 AttemptElection() 中，将自己设为候选者，并向其它服务器发送 RequestVote RPC
如果未得票超过半数，则当前 Term 不会有 Leader，于是选举超时被触发，重新选举
如果得票超过半数，将自己设置为 Leader，并向其它服务器发送心跳包 Heartbeat
发送心跳包即定期发送空的 AppendEntries PRC

首先按照 Figure 2，我们将基本的 State 填入 Raft 结构体中。在实验 Part A 中，主要用到 currentTerm 和 votedFor。除此以外，一个 Raft server 还需要管理它当前状态 state 和 lastReceive，表示最后一次收到其它服务器消息的时间，以便于判断超时。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19


type Raft struct {
mu sync.Mutex // Lock to protect shared access to this peer's state
 peers []*labrpc.ClientEnd // RPC end points of all peers
 persister *Persister // Object to hold this peer's persisted state
 me int // this peer's index into peers[]
 dead int32 // set by Kill()

// Look at the paper's Figure 2 for a description of what
 // state a Raft server must maintain.

state RaftState // Raft server state
 lastReceive time.Time // last time receive message

currentTerm int // latest term server has seen
 votedFor int // candidateId that received vote in current term
 log []LogEntry // log entries

// ...other volatile state
}

Raft 状态：Follower、Candidate 和 Leader：

1
2
3
4
5
6
7


type RaftState int
const (
Follower = iota
Candidate
Leader
)

在 Raft 初始化函数 Make() 中，state 先初始化为 Follower，currentTerm 为 0，votedFor 为 -1。之后需要用 Goroutine 启动一个选举函数 go rf.LeaderElection()，超时的话便触发选举 AttemptElection()：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16


func (rf *Raft) LeaderElection() {
for {
electionTimeout := rand.Intn(200) + 200
startTime := time.Now()
time.Sleep(time.Duration(electionTimeout) * time.Millisecond)
rf.mu.Lock()
if rf.lastReceive.Before(startTime) {
if rf.state != Leader {
// Attempt an election
 go rf.AttemptElection()
}
}
rf.mu.Unlock()
}
}

在 AttemptElection() 中，主要逻辑为：

将状态 state 转换为 Candidate，将 currentTerm 增加 1，votedFor 设置为 me
对 peers 除自己以外的服务器发送 RequestVote RPC，并统计票数，这一部需要用 Goroutine 异步并行执行

AttemptElection() 伪代码（注意除 RPC Call 之外访问资源的地方都需要 Mutex）

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27


// AttemptElection pseudocode
func (rf *Raft) AttemptElection() {
// Convert to Candidate
 // Init args and reply
 numVote := 1
for i := range(rf.peers) {
// Send RequestVote RPC and tally votes to all peers
 go func(server int) {
rf.sendRequestVote(server, &args, &reply)
// If Term is newer, conver to Follower
 // If me is not Candidate, return

if reply.VoteGranted {
numVote++
if numVote > len(rf.peers)/2 && rf.state == Candidate {
// Convert to Leader
 // Send heartbeat to peers
 for peer := range rf.peers {
go LeaderOperation(peer)
}
}
}
}(i)
}
}

RequestVote() 函数用来处理 RequestVote RPC 请求，照 Figure 2 实现即可。

LeaderOperation() 就是类似上面的 LeaderElection()，一个无限循环，定时发送 Heartbeat：

1
2
3
4
5
6
7


func (rf *Raft) LeaderOperation(server int) {
for {
// If state is not Leader, return
 go rf.SendHeartbeat(server)
time.Sleep(HeartbeatInterval)
}
}

发送 Heartbeat 又需要调用 sendAppendEntries()， AppendEntries() 用来处理 RPC 请求，具体逻辑和 Figure 2 中一样。

调试与测试

注意访问资源的地方都需要互斥锁保护：rf.mu.Lock() 和 rf.mu.Unlock()
RPC Call 之前需要确保 rf.mu.Unlock()，以防止 RPC Handler 里出现 Deadlock
在函数中如果有无限循环 for {}，慎用 defer，因为 defer 在 for {} 外面的函数末尾执行，而不是在 for {} 里面
多用 log.Printf()

测试 Part 2A：

1
2
3
4
5
6
7


$ go test -run 2A
Test (2A): initial election ...
... Passed -- 4.0 3 32 9170 0
Test (2A): election after network failure ...
... Passed -- 6.1 3 70 13895 0
PASS
ok raft 10.187s

参考：

MapReduce 原理及实现 - MIT 6.824 Lab 1

Sat, 05 Sep 2020 18:28:23 +0000

MapReduce 是 Google 的 Jeff Dean 等人在 2004 年提出的大数据处理框架。它将数据拆分为多块，在多个机器上并行处理。原本需要高性能计算资源的数据处理任务，通过 MapReduce 可以放到多个廉价的机器上并行处理。

在 MIT 6.824 分布式系统课程中，第一个实验便是用 Go 实现 MapReduce。

MapReduce 原理

MapReduce 程序分成一个 master 和多个 worker，master 负责分配和调度任务，而 worker 负责执行被分配的 Map 或 Reduce 任务
MapReduce 的输入为 M 个文件或数据块，数据之间没有依赖性；输出为 R 个 Reduce 结果文件
在 Map 任务阶段，每一个 worker 被分配一个文件，对文件内容执行用户自定义的 Map 函数，输出若干 (key, value) 对，并保存至中间文件
当 Map 任务全部执行完成后，分配 R 个 Reduce 任务，每个 worker 对应一个 Reduce 任务，收集该 Reduce 任务对应的所有中间文件，读取 (key, value) 对，将它们排序后执行 Reduce 函数，最后将结果输出

下图描绘了 MapReduce 的过程：

以计算单词个数为例，它的 Map 和 Reduce 函数可以这么表示：

1
2
3
4
5
6
7
8


Example: word count
input is thousands of text files
Map(k, v)
split v into words
for each word w
emit(w, "1")
Reduce(k, v)
emit(len(v))

更多的细节在论文 MapReduce: Simplified Data Processing on Large Cluster 中，对 MapReduce 有着很详细的解释。

MapReduce 实现

下面将基于 MIT 6.824 的实验部分，讲述一下我是如何实现基本的 MapReduce 的。现在网上大多数的实验版本还停留在几年前，但 2020 Spring 的实验代码结构有了很大的变化，相对更加自由。

首先直接克隆 MIT 6.824 的项目：

1

$ git clone git://g.csail.mit.edu/6.824-golabs-2020 6.824

项目概览：所有的文件都在 src 文件夹下面。按照实验页面描述的可以执行已经给好的 sequential 的 MapReduce。示例是执行 wc.go 的统计单词数的任务。

1
2
3
4


$ cd 6.824/src/main
$ go build -buildmode=plugin ../mrapps/wc.go
$ rm mr-out*
$ go run mrsequential.go wc.so pg*.txt

这个 Lab 是实现一个分布式的 MapReduce，由 master 和 worker 组成，它们将通过 RPC 进行通讯。

在这个 Lab 中，我们只需要修改 src/mr 目录下的 master.go、rpc.go 和 worker.go。

需求分析

只有一个 master 实例，来分配调度 MapReduce 的任务
worker 实例需要不断向 master 请求任务，在完成任务之后向 master 报告任务完成
master 先分配 Map 任务，在所有 Map 任务结束后，再分配 reduce 任务
master 在完成所有任务之后退出，此时如果还有 worker 向 master 请求任务，则会因为 RPC 请求失败而直接退出
如果 worker 意外退出，或者长时间未响应，则 master 需要重新分配该任务

实现

这个 Lab 的切入口是 worker.go，我们在 Worker 函数中，需要不断请求任务，master 根据当前状态分配任务。因此 worker 并不需要管理状态，只需要根据 RPC 返回的结果执行相应的任务。

对于 master，我们需要所有输入文件名、Reduce 任务数量 R。因为 Map 任务的数量等于输入文件的数量 M，所以可以维护一个长为 M 的数列来管理所有 Map 任务的状态。同理也可以用长为 R 的数列管理 Reduce 任务。因而主要的 master 数据结构可以如下构造：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


type Master struct {
files []string
nReduce int
mapTasks []MapReduceTask
reduceTasks []MapReduceTask
mapFinished bool
reduceFinished bool
mutex sync.Mutex
}

对于每个任务，自定义了一个 MapReduceTask 的结构体封装对应的数据。根据上面的需求分析，每个任务需要有：

类型 Type：Map|Reduce|Wait
任务的状态 Status：Unassigned|Assigned|Finished
该任务在原来任务列表里的 Index（方便定位和更新对应的任务）
开始时间 Timestamp，便于判断任务超时
Map 任务文件 MapFile，以及 Reduce 任务中间文件列表 ReduceFiles

1
2
3
4
5
6
7
8


type MapReduceTask struct {
Type string // "Map", "Reduce", "Wait"
 Status int // "Unassigned", "Assigned", "Finished"
 Index int // Index of the task
 Timestamp time.Time // Start time
 MapFile string // File for map task
 ReduceFiles []string // List of files for reduce task
}

RPC 消息的定义非常简单，worker 向 master 请求时有两种情况：

请求新的任务 RequestTask，不需要额外数据
任务完成 FinishTask，需要将完成的任务 Task 传给 master 以便更新任务列表

而 master 回复时则只需要指定 Task 以及告诉总的 Reduce 任务数量。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


const (
RequestTask = iota
FinishTask
)
type MapReduceArgs struct {
MessageType int
Task MapReduceTask
}
type MapReduceReply struct {
Task MapReduceTask
NReduce int
}

因此 master 的逻辑便是：

Master 结构初始化时，得到所有待处理文件 files 以及 Reduce 结果数量 nReduce。

将待处理文件顺序加入到 mapTasks 中，并初始化每个任务状态为 Unassigned。同样的，将 nReduce 个 Task 加入 reduceTasks 中
定义 RPC 处理函数 WorkerCallHandler(args *MapReduceArgs, reply *MapReduceReply) error，worker 的 RPC 请求将由这个函数处理
判断请求类型 RequestTask/FinishTask

如果是请求任务，先通过 mapFinished 判断是否 Map 阶段已完成，若未完成，则在 mapTasks 中选择一个 Unassigned 或者超时的任务；对于 Reduce 阶段，也是一样的。如果所有 Map 任务都已经被分配，并且没有完全结束，则返回一个 Wait 任务让 worker 等待

如果是完成任务，则首先判断 worker 返回的任务 Timestamp 是否一致（因为会有任务超时被重新分配，所以时间戳会不一致）。接着将对应的任务标记为 Finished，并判断是否所有的任务都已经 Finished。

需要注意的：

因为可能有多个 worker 同时请求，所以需要用 Mutex，确保同时只有一个线程在修改 master 变量
因为要求能够处理 worker 不响应或异常退出的情况，所以 worker 需要先将中间文件写入临时文件，将临时文件名返回 master，若成功返回了便在 master 将其重命名，确保只有成功完成的任务才有合法的文件名。如 Map 的中间结果为 mr-<maptask_id>-<reducetask_id>，而 Reduce 的结果为 mr-out-<reducetask_id>

对于 worker，只需要根据分配的任务执行相应的函数。具体的 Map 和 Reduce 任务可以参考 mrsequential.go：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21


func Worker(mapf func(string, string) []KeyValue,
reducef func(string, []string) string) {
for true {
args := MapReduceArgs{MessageType: RequestTask}
reply := MapReduceReply{}
res := call("Master.WorkerCallHandler", &args, &reply)
if !res {
break
}
switch reply.Task.Type {
case "Map":
doMap(&reply, mapf)
case "Reduce":
doReduce(&reply, reducef)
case "Wait":
time.Sleep(1 * time.Second)
}
}
}

在实现好之后通过 src/main/test-mr.sh 执行所有的测试：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17


$ sh test-mr.sh
*** Starting wc test.
2020/09/06 19:39:30 rpc.Register: method "Done" has 1 input parameters; needs exactly three
--- wc test: PASS
*** Starting indexer test.
2020/09/06 19:39:36 rpc.Register: method "Done" has 1 input parameters; needs exactly three
--- indexer test: PASS
*** Starting map parallelism test.
2020/09/06 19:39:39 rpc.Register: method "Done" has 1 input parameters; needs exactly three
--- map parallelism test: PASS
*** Starting reduce parallelism test.
2020/09/06 19:39:47 rpc.Register: method "Done" has 1 input parameters; needs exactly three
--- reduce parallelism test: PASS
*** Starting crash test.
2020/09/06 19:39:55 rpc.Register: method "Done" has 1 input parameters; needs exactly three
--- crash test: PASS
*** PASSED ALL TESTS

参考：

使用 Bazel 构建项目

Sat, 29 Aug 2020 18:28:23 +0000

如何让项目的构建更有效率是工程中不可忽视的问题，特别是在项目的规模不断增大之后。传统的 C/C++ 项目，有诸如 Make、CMake 这样的工具，Java 项目则有 Maven/Gradle。但在真正企业级的大型项目里，可能会同时有 C++、Python、Go 或者 Java 项目，并且互相可能会有依赖关系。

Bazel 便是由 Google 开发和开源的项目构建测试工具，支持多种语言多个平台。Bazel 凭借其企业级的背景、远程执行的特性，被许多公司使用。Dropbox 在 2019 年末的博文中介绍了全面使用 Bazel 作为 CI/CD 工具。这篇文章将会以一个简单的项目为例，介绍 Bazel 的基本使用。

Bazel 的安装相对比较简单，在它的 GitHub Releases 页面就可以下载对应的二进制安装包。

构建 C++ 项目

Bazel 中比较重要的两个文件是：

WORKSPACE：含有该文件的目录将会被视为根目录
BUILD：含有该构建规则文件的目录被视为项目的一个模块

下面以官方的 examples 为例。首先克隆项目到本地：

1

$ git clone https://github.com/bazelbuild/examples

进入 examples/cpp-tutorial/stage1 目录下，有一个 WORKSPACE 文件，因为没有用到自定义的一些规则，所以该文件是空的。在 main 和目录下面有 BUILD 文件，包含了构建的目标：

1
2
3
4
5
6


load("@rules_cc//cc:defs.bzl", "cc_binary")
cc_binary(
name = "hello-world",
srcs = ["hello-world.cc"],
)

第一行 load 导入了内置的 cc_binary 规则，之后的 hello-world 则实例化了这个规则，通过 srcs 参数指定了源文件。

在 stage1 目录下，通过命令 $ bazel run //main:hello-world 即可编译并执行 hello-world 目标。如果是使用 bazel build 命令的话则只是进行编译，构建的目标则是相对于根目录 // 的 main 目录下的 BUILD 里声明的 hello-world 目标。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


❯ bazel run //main:hello-world
Starting local Bazel server and connecting to it...
INFO: Analyzed target //main:hello-world (14 packages loaded, 47 targets configured).
INFO: Found 1 target...
Target //main:hello-world up-to-date:
bazel-bin/main/hello-world
INFO: Elapsed time: 19.863s, Critical Path: 0.72s
INFO: 2 processes: 2 linux-sandbox.
INFO: Build completed successfully, 6 total actions
INFO: Build completed successfully, 6 total actions
Hello world

在 stage2 的例子里，展示了如何使用 cc_library 库并定义依赖关系。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15


load("@rules_cc//cc:defs.bzl", "cc_binary", "cc_library")
cc_library(
name = "hello-greet",
srcs = ["hello-greet.cc"],
hdrs = ["hello-greet.h"],
)
cc_binary(
name = "hello-world",
srcs = ["hello-world.cc"],
deps = [
":hello-greet",
],
)

同样的，在 load 里引入 cc_binary 和 cc_library 两个规则。hello-world 目标在 deps 中指定了依赖当前目录下的 hello-greet 模块。如果需要用到其它目录下的模块，在 stage3 下面就有例子，deps 中的模块需要像 "//lib:hello-time" 这样指定根目录下的子模块。

构建 Python 项目

在 Bazel 中使用 Python，需要引入自定义的 Python 规则。Bazel 官方开源了 rules_python。

首先确保默认的 Python 在 /usr/bin/python 路径下，可以输入 which python 来确认。如果没有的话，需要手动进行一下软链接：

1

$ sudo ln -s /usr/bin/python3 /usr/bin/python

接下来，创建一个新的工程目录 project，首先需要在根目录下创建 WORKSPACE 文件，包含有 WORKSPACE 文件的目录将会被 Bazel 视为根目录。为了能够在这个工作区中使用 Python 构建规则，需要添加 Python 构建的规则到 WORKSPACE：

1
2
3
4
5
6
7


load("@bazel_tools//tools/build_defs/repo:http.bzl", "http_archive")
http_archive(
name = "rules_python",
url = "https://github.com/bazelbuild/rules_python/releases/download/0.0.2/rules_python-0.0.2.tar.gz",
strip_prefix = "rules_python-0.0.2",
sha256 = "b5668cde8bb6e3515057ef465a35ad712214962f0b3a314e551204266c7be90c",
)

在根目录下创建 hello/main.py 文件：

1
2


if __name__ == "__main__":
print("Hello World")

之后在 hello 下添加 BUILD 文件：

1
2
3
4
5
6


load("@rules_python//python:defs.bzl", "py_binary")
py_binary(
name = "main",
srcs = ["main.py"],
)

同样，运行 $ bazel run //hello:main，便可以执行 main.py。如果脚本需要参数的话，可以在中间用 -- 分隔，并紧跟在后面指定参数： $ bazel run //hello:main -- <Arguments>

远程执行

远程执行也是 Bazel 的一个亮点。远程执行的好处是可以利用云平台的多个机器进行分布式构建，并且缓存编译，这样可以大大加快构建速度。关于远程执行，具体参考官方的 Remote execution overview。好像要自己搭。

参考：

Python 执行 Bash 命令得到实时输出

Sat, 01 Aug 2020 18:28:23 +0000

有些时候，我们需要在 Python 里执行一些 Bash / Shell 命令，比如调用外部的构建工具、Git 或者是其它程序。这时候，用 Python 自带的 subprocess 模块可以很方便的实现。在实际使用中，真正让人头大的有两点：如何执行像脚本一样运行多行 Shell 命令；以及如何实时得到命令的输出。

对于非常简单的 Shell 命令，只需要使用 subprocess.Popen 即可：

1
2
3
4
5


import subprocess
process = subprocess.Popen(['echo', 'Hello World'],
stdout=subprocess.PIPE,
stderr=subprocess.PIPE)
stdout, stderr = process.communicate()

上面的代码很好懂，即使用 Popen 开启一个新的进程执行命令，并将 stdout 和 stderr 通过 PIPE 记录。这个方式非常简单，适用于大多数情况。

但如果你的命令需要很长时间才能执行完成，会需要实时的输出。最简单的方式便是不将 stdout 和 stderr 通过 PIPE 记录，如此一来便无法得到 stdout 中的内容；此外，还可以通过 tee 命令配合 2>&1，比如 echo hello 2>&1 | tee dev/tty，这个方法可行但是对于每一行 Shell 命令都得使用。

经过了一番探索，最后找到了一个既可以执行多行 Shell 命令，并且能够得到实时输出的方法：

首先用 Popen 打开 /bin/bash 实例，将我们需要执行的 Shell 指令通过 stdin 传入，这样子做的好处是可以让 bash 逐行执行每一条命令。之后在一个 while 循环中，持续地读子进程 stdout 的内容，通过 proc.poll() 判断子进程是否终止来终止循环，最后通过 proc.wait() 得到子进程退出的代码，如果非 0 的话表示异常退出，进而选择下一步的操作。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25


proc = subprocess.Popen(
"/bin/bash",
stdin=subprocess.PIPE,
stdout=subprocess.PIPE,
shell=True
)
proc.stdin.write(commands.encode())
proc.stdin.flush()
proc.stdin.close()
# Real time stdout of subprocess
stdout = []
while True:
line = proc.stdout.readline().decode()
stdout.append(line)
if line == "" and proc.poll() is not None:
break
# Print outputs
sys.stdout.write(line)
# Wait for child process and get return code
return_code = proc.wait()

这样便可以像 GitHub Action 一样 run 多行的命令了

1
2
3
4
5
6
7


jobs:
 say_hello:
 runs-on: ubuntu-latest
 steps:
 - run: |
 echo "Hello ${{ github.event.inputs.name }}!"
 echo "- in ${{ github.event.inputs.home }}!"

参考：

支持向量机 (SVM) 的解析与推导

Sun, 28 Jun 2020 13:40:23 +0000

两年前在面某司 AI Lab 的时候，就有被问到支持向量机（support vector machines, SVM）的推导。正好上一学期在 Machine Learning 的课上又学到，这里便记录一下 SVM 的基本推导过程。

前言

在开始之前先推荐一下李航的《统计学习方法》以及周志华的《机器学习》。这两本书可以结合起来看，对理解许多机器学习的原理有非常大的帮助。SVM 的推导中有大量的定理以及数学公式，看着确实挺吓人，但是只要一步步地弄懂，就也不是非常的难。这篇文章花费了挺长的时间来写，参考了上面提到的两本书，以及尽量简单的将每一步解释清楚，不过还是有一些数学的细节以及严谨证明略过了，因为也不在本文的讨论范围之内。

这里将讨论最基本的二分类的支持向量机（support vector machines, SVM），考虑训练样本集 $D={ (\vec{x_1},y_1),...,(\vec{x_m},y_m), y_i \in {-1,+1} }$。将从最基本的超平面划分训练样本开始，导出 SVM 的基本问题，再利用对偶问题求解，最后讨论 SVM 的核技巧，以及如何在 Python 中使用 SVM。

超平面

超平面（Hyper Plane）是在样本空间中的一个平面。在我们熟悉的二维平面上，一条直线的方程可以表示为 $ax+by+c=0$，推广到多维的情况之后，超平面可以用向量的形式表示为 $\vec{w}\cdot\vec{x}+b=0$，记为 $(\vec{w}, b)$ 的形式，其中 $\vec{w}$ 是法向量，而 $b$ 为位移项。

考虑任意一点 $\vec{x}$ 到超平面之间的距离，可以表示为：

$$ \gamma=\frac{\vert\vec{w}\cdot\vec{x}+b\vert}{\Vert \vec{w} \Vert} $$

超平面能将样本空间划分成两部分。假设超平面 $(\vec{w}, b)$ 将所有样本正确分类，即对于任意的 $(\vec{x_i},y_i)\in D$，若 $y_i=+1$，那么 $\vec{w}\cdot\vec{x}+b > 0$，若 $y_i=-1$，那么 $\vec{w}\cdot\vec{x}+b < 0$。像这样的决策函数可以表示为：

$$ y_i=\text{sign}(\vec{w}\cdot\vec{x_i}+b) $$

那么，在一个空间中，会存在多个超平面能够将训练样本分开，那么究竟该努力去找哪一个超平面呢？

最大间隔

对于 $(\vec{x_i}, y_i)$，我们可以将上面的距离公式的分子部分代入 $y_i$ 改写成：

$$ \gamma_i=\frac{y_i(\vec{w}\cdot\vec{x}+b)}{\Vert \vec{w} \Vert} $$

定义间隔（margin）$\gamma$ 为所有样本中离超平面最近的那个，即 $\gamma=\min \gamma_i$，那么 $\gamma_i \ge \gamma$ 总是成立的，代入上式可得：

$$ \frac{y_i(\vec{w}\cdot\vec{x}+b)}{\Vert \vec{w} \Vert} \ge \gamma $$

因此，SVM 的问题就变成了找到“最大间隔”（maximum margin）的超平面，使得 $\gamma$ 最大，即：

$$ \begin{array}{l}\max\limits_{(\vec{w},b)} \ \min\limits_{i} \frac{1}{\Vert\vec{w}\Vert}\vert\vec{w}\cdot\vec{x_i}+b\vert \\ \text{s.t.} \quad y_i(\vec{w}\cdot\vec{x_i}+b) > 0, \quad i=1,2,...,m \end{array} $$

因为间隔始终大于 0，即 $\vert\vec{w}\cdot\vec{x_i}+b\vert > 0$，则可以通过缩放 $(\vec{w}, b)$ 使得 $\min\limits_i \vert\vec{w}\cdot\vec{x_i}+b\vert =1$，那么上面的问题就变成 $\max\frac{1}{\Vert\vec{w}\Vert} $，即 $\min\Vert\vec{w}\Vert$，在其它书里通常会被等价成 $\min\frac{1}{2}\Vert\vec{w}\Vert^2$，于是上式可以重写成：

$$ \begin{array}{l} \min\ \frac{1}{2}\Vert\vec{w}\Vert^2 \\ \text{s.t.} \quad y_i(\vec{w}\cdot\vec{x_i}+b) \ge 1, \quad i=1,2,...,m \end{array} $$

是一个凸二次规划（convex quadratic programming）问题，这样就能够利用上现有的求解优化问题的方法。

对偶问题

首先考虑一个最优化问题：

$$ \begin{array}{l}\min f(\vec{z}) \\ \text{s.t.} \quad h_i(\vec{z})\le 0 \end{array} $$

引入拉格朗日函数 $\mathcal{L}(\vec{z},\vec{\alpha})$，其中 $\vec{\alpha}=(\alpha_1,...,\alpha_m)$，$\alpha_i \ge 0$ 为拉格朗日乘子，则有：

$$ \mathcal{L}(\vec{z},\vec{\alpha})=f(\vec{z})+\sum \alpha_i h_i(\vec{z}) $$

那么上面的最优化问题等价于：

$$ \min\limits_{\vec{z}}\ \max\limits_{\vec{\alpha}\ge 0 } \ \mathcal{L} (\vec{z}, \vec{\alpha}) $$

称为原始问题（primal problem）。下面来证明其等价于一开始的优化问题，主要思路是将拉格朗日函数展开代入，再利用 $\vec{\alpha}\ge0$的条件消去第二项：

$$ \begin{aligned} & \min\limits_{\vec{z}}\ \max\limits_{\vec{\alpha}\ge 0 } \ \mathcal{L} (\vec{z}, \vec{\alpha}) \\ = &\min\limits_{\vec{z}}\left( f(\vec{z})+\max\limits_{\vec{\alpha}\ge 0}\sum \alpha_i h_i(\vec{z})\right) \\ =& \min\limits_{\vec{z}}\left( f(\vec{z})+ \begin{cases}0, &\text{if } h_i(\vec{z})\le 0 \\ \infty, &\text{if } h_i(\vec{z})\gt 0 \end{cases} \right) \\ =&\min\limits_{\vec{z}} f(\vec{z}) \end{aligned} $$

将该问题的中的 $\min$ 和 $\max$ 交换位置，即可得到其对偶问题（dual problem）：

$$ \max\limits_{\vec{\alpha}\ge 0 }\ \min\limits_{\vec{z}} \mathcal{L} (\vec{z}, \vec{\alpha}) $$

原始问题与对偶问题的关系：

$$ \max\limits_{\vec{\alpha}\ge 0 }\ \min\limits_{\vec{z}} \mathcal{L} (\vec{z}, \vec{\alpha}) \le \min\limits_{\vec{z}}\ \max\limits_{\vec{\alpha}\ge 0 } \mathcal{L} (\vec{z}, \vec{\alpha}) $$

在某些条件下，原始问题与对偶问题的最优值相等，这时候可以用解对偶问题代替解原始问题。该条件称为 KKT（Karush-Kunh-Tucker）条件，具体证明超出了本文的涉及范围，我自己也不会，就先略过。在这个条件下，可以从 SVM 问题的对偶问题求解，进而得到 SVM 的解。

求解 SVM

将 SVM 的问题用拉格朗日函数的形式重写为：

$$ \mathcal{L}(\vec{w}, b, \vec{\alpha}) = \underbrace{\frac{1}{2}\Vert\vec{w}\Vert^2}_{f(\vec{w},b)} + \sum \alpha_i \underbrace{\left(1-y_i(\vec{w}\cdot\vec{x_i}-b)\right)}_{h_i(\vec{w},b)\le0} $$

令 $\mathcal{L}(\vec{w}, b, \vec{\alpha})$ 对于 $\vec{w}$ 和 $b$ 的偏导数等于零：

$$ \begin{cases} \frac{\partial \mathcal {L}}{\partial \vec{w}} = \vec{w}-\sum\alpha_i y_i \vec{x_i}=0 \\ \frac{\partial \mathcal {L}}{\partial b} =\sum\alpha_i y_i =0 \end{cases} $$

可得：

$$ \begin{aligned} \vec{w}&=\sum\alpha_i y_i \vec{x_i} \\ 0 &=\sum\alpha_i y_i \end{aligned} $$

将上式代入 $\mathcal{L}(\vec{w}, b, \vec{\alpha})$ 可得：

$$ \begin{aligned} \mathcal{L}(\vec{w}, b, \vec{\alpha}) =& \frac{1}{2}\left(\sum\alpha_i y_i \vec{x_i}\right)\cdot\left(\sum\alpha_i y_i \vec{x_i}\right) \\ &+ \sum\alpha_i\left(1-y_i\left(\left(\sum\alpha_i y_i \vec{x_i}\right)\cdot\vec{x_i}-b)\right)\right) \\ =&\sum_{i=1}^{m}\alpha_i - \frac{1}{2}\sum_{i=1}^{m}\sum_{j=1}^{m}\alpha_i \alpha_j y_i y_j \left(\vec{x_i}\cdot \vec{x_j}\right) \end{aligned} $$

这样，对偶问题就变成：

$$ \begin{aligned} &\max\limits_{\vec{\alpha}\ge 0 }\ \min\limits_{\vec{z}} \mathcal{L} (\vec{z}, \vec{\alpha}) \\ \implies & \max\limits_{\vec{\alpha}\ge 0 } \sum_{i=1}^{m}\alpha_i - \frac{1}{2}\sum_{i=1}^{m}\sum_{j=1}^{m}\alpha_i \alpha_j y_i y_j \left(\vec{x_i}\cdot \vec{x_j}\right) \\ &\ \text{s.t.}\quad \sum\alpha_i y_i = 0,\ \alpha_i \ge 0 \end{aligned} $$

解出 $\vec{\alpha}$ 后，求出 $\vec{w}$ 与 $b$ 即可得到模型：

$$ \begin{aligned} f(\vec{x}) &=\vec{w}\cdot\vec{x}+b \\ &=\sum_{i=1}^{m}\alpha_i y_i \left(\vec{x_i}\cdot\vec{x}\right)+b \end{aligned} $$

具体求解过程需要满足上面提到的 KTT 条件：

$$ \begin{cases} \alpha_i\ge 0 \ ; \\ y_i f(\vec{x_i}) - 1\ge 0 \ ; \\ \alpha_i(y_i f(\vec{x_i})-1) = 0 \ . \end{cases} $$

求解上面的对偶问题的一个著名算法是 SMO (Sequential Minimal Optimization)，这里不展开叙述。

软间隔

上面我们考虑的都是数据可以分隔的情况，那么当数据集并不是完全能被超平面分隔，即有些点不满足约束 $y_i(\vec{w}\cdot\vec{x_i}+b) \ge 1$，那可以设定一个惩罚项：

$$ \xi_i=\max\left\{ 1-y_i(\vec{w}\cdot\vec{x_i}+b), 0 \right\} $$

那么原来的 SVM 的优化问题就会变成： $$ \begin{array}{l} \min\limits_{\vec{w},b}\ \frac{1}{2}\Vert\vec{w}\Vert^2 + C\sum_{i=1}^{m}\max\left\{1-y_i(\vec{w}\cdot\vec{x_i}+b), 0\right\} \\ \text{s.t.} \quad 1-y_i(\vec{w}\cdot\vec{x_i}+b) \le 0, \quad i=1,2,...,m \end{array} $$ 其中的 $\max(1-z, 0)$ 称为“折页损失”（hinge loss）。接着引入“松弛变量”(slack variable) $\xi_i\ge0$，将上式重写为： $$ \begin{aligned} &\min\limits_{\vec{w},b}\ \frac{1}{2}\Vert\vec{w}\Vert^2 + C\sum_{i=1}^{m}\xi_{i} \\ \text{s.t.}\quad &y_i(\vec{w}\cdot\vec{x_i}+b) \ge 1-\xi_i \\ &\xi_i \ge 0, \ i=1,2,...,m \end{aligned} $$ 即可得到“软间隔支持向量机”(soft margin SVM)。求解方法与前面是一样的，具体过程可以参考西瓜书。

核方法

当遇到样本是非线性可分时，一般的线性 SVM 就无法很好的分类，这时候可以采用核技巧（kernel trick），将样本映射至高维空间，变成高维空间中线性可分的即可。

考虑一个映射函数 $\phi(\vec{x})$，将 $d$ 维特征映射至 $m$ 维： $$ \phi(\vec{x}): \mathbb{R}^d \to \mathbb{R}^m $$ 定义核函数（kernel function）： $$ K(\vec{x_i}, \vec{x_j})= \phi(\vec{x_i}) \cdot \phi(\vec{x_j}) $$ 核技巧的思想是用核函数 $K$ 避免在高维 $m$ 空间中计算映射函数的内积，这样能够极大简化运算。

根据 Mercer's theorem，函数 $K$ 能够满足成为核函数的充分必要条件是 $K$ 是半正定（positive semidefinite），即

$$ \sum_{i,j=1}^m c_i c_j K(\vec{x_i}, \vec{x_j}) \geq 0 $$ 常用的核函数有多项式核函数（Polynomial function）：

$$ K(\vec{x_i}, \vec{x_j}) = (\vec{x_i} \cdot \vec{x_j} + 1)^d $$ 以及高斯核函数（Guassian radial basis function），通常称为 RBF Kernel：

$$ K(\vec{x_i}, \vec{x_j}) = \exp \left(- \frac{\Vert\vec{x_i}-\vec{x_j}\Vert^2}{2\sigma^2} \right) $$

更多的关于核方法的详细推导，可以参考推荐的两本书中的相应章节。

Python 中使用 SVM

在 Python 中可以用 scikit-learn 非常方便的使用 SVM。对于二分类或多分类问题，通常使用 SVC()，可以在参数中指定它的 kernel，当 kernel='linear' 时便退化成了线性支持向量机。一般使用 rbf 核的 SVM 会有较好的分类效果。

1
2
3
4
5


from sklearn import svm
X = [[0, 0], [1, 1]]
y = [0, 1]
clf = svm.SVC()
clf.fit(X, y)

参考：

C++ 20 Modules 尝鲜

Mon, 22 Jun 2020 19:14:23 +0000

Modules 是 C++ 20 标准里面非常重要的一个新特性，引进了在其它编程语言中常用的 import 关键词，让 C++ 在几十年前就有的 #include 基础上支持更现代的模块设计，减轻传统的头文件带来的一些问题，提升编译的速度。于是我尝试了一下用 Modules 写一个简单的 Hello World。

安装 Clang 10

由于 Modules 是 C++ 20 的标准，因而较老的编译器并不一定能够支持这一特性，推荐最新的 Clang 10.0.0。首先安装必要的运行时与编译库：

1

$ sudo apt install build-essential libncurses5

可以到 LLVM 的下载页面选择自己的平台下载，解压后即可在 bin 目录中找到 Clang 及 LLVM 的相关可执行文件。建议使用 Linux 平台以避免一些使用问题。也可以直接用 LLVM 提供的安装脚本：

1

$ bash -c "$(wget -O - https://apt.llvm.org/llvm.sh)"

Hello World Module

接着我们创建一个简单的 helloworld.cpp 文件，实现一个最简单的 helloworld Module，通过 export 关键词将函数变量提供给外部程序使用：

1
2
3


/// helloworld.cpp
export module helloworld;
export auto hello() { return "Hello C++ 20!"; }

接着创建 main.cpp，使用 import 关键词导入 helloworld Module：

1
2
3
4
5
6
7
8


/// main.cpp
#include <iostream>
import helloworld;
int main() {
std::cout << hello() << std::endl;
return 0;
}

编译分为两步，首先我们需要将用到的模块编译成 BMI（Binary Module Interface），即先把 helloworld.cpp 模块编译成 .pcm（precompiled module）文件，再编译 main.cpp。注意这里需要 -std=c++2a，用 -std=c++20 就有问题，迷…… 用 g++10 编译命令似乎更简单，估计等 Clang 对 C++ 20 的标准支持更完善了之后，编译会更方便。

用 Clang 10 编译和运行：

1
2
3
4
5


$ clang++ -std=c++2a -c helloworld.cpp -Xclang -emit-module-interface -o helloworld.pcm
$ clang++ -std=c++2a -stdlib=libc++ -fprebuilt-module-path=. main.cpp helloworld.cpp
$ ./a.out
Hello C++ 20!

用 import 代替 #include

进一步，我们可以将上面的 #include 也用 import 来代替。注意最后需要添加分号 ;。

1
2
3


// main.cpp
import <iostream>;
import helloworld;

这时候我们在编译的时候需要额外两个 flag：-fimplicit-modules 和 -fimplicit-module-maps，具体可以参考 Clang 的文档。现在 Clang 还不支持 Semantic import，也就是无法使用 import std.io 语法（MSVC 支持）。这里我们直接用 import 替换 #include，去除 #include 使语法暂时保持一致。

由于之前的 helloworld 模块并没有任何变化，因此只需要重新编译一下第二步即可：

1

$ clang++ -std=c++2a -stdlib=libc++ -fimplicit-modules -fimplicit-module-maps -fprebuilt-module-path=. main.cpp helloworld.cpp

Module 中使用 namespace

在一个模块里，我们也能 export 命名空间，下面的例子演示了如何导出和使用 helloworld 的 namespace，避免带来全局函数的干扰。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


/// helloworld.cpp
module;
import <cstdio>;
export module helloworld;
export namespace helloworld {
int global_data;
void say_hello() {
std::printf("Hello Module! Data is %d\n", global_data);
}
}

1
2
3
4
5
6
7


/// main.cpp
import helloworld;
int main() {
helloworld::global_data = 123;
helloworld::say_hello();
}

编译命令和之前基本相同，只不过因为模块里面用到了 import <cstdio>，因此在编译模块的时候需要指定 -stdlib=libc++ 以及 -fimplicit-modules 和 -fimplicit-module-maps：

1
2
3
4
5


$ clang++ -std=c++2a -stdlib=libc++ -fimplicit-modules -fimplicit-module-maps -c helloworld.cpp -Xclang -emit-module-interface -o helloworld.pcm
$ clang++ -std=c++2a -stdlib=libc++ -fimplicit-modules -fimplicit-module-maps -fprebuilt-module-path=. main.cpp helloworld.cpp
$ ./a.out
Hello Module! Data is 123

Module 的规范

一个推荐的 Module 规范结构如下

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20


module;
#include <standard library header>
#include "library not ready for modularization"
...
export module top.middle.bottom;
import modularized.standard.library.component;
import other.modularized.library;
...
#include "module internal header" // beware!

non-exported declarations;
...
export namespace top {
namespace middle {
namespace bottom {
exported declarations;
...
}}}

写在后面

Module 还有一系列的特性，比如将接口（Interface）和实现（Implementation）分离，模块分割（Module Partitions）等等，更多高级的用法可以参考视频：Modules the beginner's guide - Daniela Engert - Meeting C++ 2019。

但是目前主流的编译器对于 C++ 20 的标准还没有支持完备，因此很多功能也只能先“尝鲜”，等到一段时间后或许这些新的标准会像 C++ 11 一样让 C++ 再次焕发新的活力。

参考：

Telegram 自动通知脚本运行结果

Fri, 19 Jun 2020 18:28:23 +0000

很多时候，运行一个耗时的脚本，像是编译或神经网络的拟合，我们并不想一直盯着屏幕到运行完成，希望能在脚本执行完成之后能够自动给我们发送结果，用 Telegram Bot 可以轻松实现自动化的消息提醒。

之前我也试过用 Email 的方式发送脚本运行结果，但需要用到 Python，相较而言更为复杂。

创建和使用 Telegram Bot

创建 Telegram Bot 非常简单。首先在 Telegram 中查找 BotFather，输入 /newbot，按照提示输入名称和 Bot 的唯一用户名之后即可创建成功，随即会得到一串 HTTP API Token，记下这个 Token。

前往你刚刚创建的 Bot 的聊天界面，随便输入任何消息。之后在浏览器中打开链接 https://api.telegram.org/bot<TOKEN>/getUpdates，找到你的 Chat ID。随后在浏览器中打开链接测试给自己的账号发送 Hello World 的消息：

https://api.telegram.org/bot<TOKEN>/sendMessage?chat_id=<CHAT_ID>&text=Hello%20World

通过 Bash 脚本发送消息

上面的例子是一个非常简单的 HTTP 请求，在 Bash 中用 cURL 可以很便捷的实现

1
2


$ curl -s -X POST https://api.telegram.org/bot<TOKEN>/sendMessage \
 -d chat_id=<CHAT_ID> -d text="Hello World"

这时候就可以创建一个简单的 Bash 脚本来自动发送消息了，创建如下的 send.sh，只需 $ bash send.sh 即可自动发送消息。

1
2
3
4
5
6
7
8


#!/bin/bash

TOKEN=<TOKEN>
CHAT_ID=<CHAT_ID>
MESSAGE="Hello World"
URL="https://api.telegram.org/bot$TOKEN/sendMessage"
curl -s -X POST $URL -d chat_id=$CHAT_ID -d text="$MESSAGE"

同样的，也可以发送文件：

1
2
3
4
5
6


CAP="Run Script"
FILE="log.txt"
URL_FILE="https://api.telegram.org/bot${TOKEN}/sendDocument"
curl -s -X POST $URL_FILE -F chat_id=$CHAT_ID -F caption="$CAP" \
 -F document=@"$FILE" > /dev/null

通用的消息提醒脚本

进一步，我想创建一个脚本 run.sh 的通用脚本，运行 $ bash run.sh cmd.sh 即可执行 cmd.sh 中的命令并在结束之后将结果发送到 Telegram

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31


#!/bin/bash

HOST=`hostname`
DATETIME=`date "+%Y%m%d-%H%M%S"`
# Telegram bot settings
TOKEN=<TOKEN>
CHAT_ID=<CHAT_ID>
# URLs for sending messages and files
URL_MESSAGE="https://api.telegram.org/bot$TOKEN/sendMessage"
URL_FILE="https://api.telegram.org/bot$TOKEN/sendDocument"
# Log settings
THIS_PATH=`dirname "$0"`
LOG_FILE="$HOME/workspace/logs/$DATETIME.txt"
# Run the script
SCRIPT="`dirname "$0"`/$1"
[ -f $SCRIPT ] || { echo "$SCRIPT does not exist!" && exit 1; }
printf "$DATETIME\n" >> $LOG_FILE && cat $SCRIPT >> $LOG_FILE
bash $SCRIPT 2>&1 | tee -a $LOG_FILE
# Send log
CAP="Run on $HOST at $DATETIME"
curl -s -X POST $URL_FILE -F chat_id=$CHAT_ID -F caption="$CAP" -F document=@"$LOG_FILE" > /dev/null
# Send message
#curl -s -X POST $URL_MESSAGE -d chat_id=$CHAT_ID -d text="$MESSAGE"

其中，最重要的是 bash $SCRIPT 2>&1 | tee -a $LOG_FILE，即将脚本的输出同时显示在终端并且保存到文件 $LOG_FILE 中。

此外，还可以集成 Seashells，将脚本运行结果实时输出到在线终端中，对于训练神经网络之类的任务能够更方便的查看。之后便可将 Seashells 的 URL 通过 Telegram 发送给自己，就可以实时查看脚本运行进度。

写在后面

上面展示了如何在 Bash 脚本中使用，同样也可以在 Python 中使用，GitHub 上已经有了现成的 wrapper：python-telegram-bot，能够直接 import。

Telegram Bot 还有更多玩法，不仅仅是用在发送脚本的消息提醒，比如结合 Microsoft Bot Framework 创建了对话式聊天机器人等。

参考：

随时随地 SSH 连接家中电脑

Thu, 18 Jun 2020 18:28:23 +0000

记录一下如何让家里的电脑 / 服务器能够随时被 SSH 远程登陆访问。话说以前本科的实验室 GPU 服务器只能在内网访问，宿舍离实验室又很远，炎炎烈日，我只能动一动手配置反向代理，让我能在凉爽的宿舍里 SSH 到我实验室的服务器上炼丹。

开启 SSH Server

在非服务器版的 Ubuntu 上，默认是没有 SSH 服务器的，因此需要安装和启用 openssh-server

1
2


$ sudo apt update
$ sudo apt install openssh-server

安装好之后默认会启动 SSH Server，可以通过命令查看服务状态，显示 Active 应该就是正常启动了

1
2
3
4
5
6
7
8


$ sudo service ssh status
● ssh.service - OpenBSD Secure Shell server
Loaded: loaded (/lib/systemd/system/ssh.service; enabled; vendor preset: enabled)
Active: active (running) since Thu 2020-06-18 18:15:48 EDT; 1 day 22h ago
Main PID: 17916 (sshd)
Tasks: 1 (limit: 4915)
CGroup: /system.slice/ssh.service
└─17916 /usr/sbin/sshd -D

还需要在防火墙中允许 SSH 的连接

1

$ sudo ufw allow ssh

之后我们需要知道本机在内网中的 IP 地址

1

$ ip a

我们会看到有几张不同的网卡，找到你使用的网卡下面诸如 inet 192.168.1.27/24 的一串地址，说明子网的地址即为 192.168.1.27

此时，可以测试一下 SSH 服务器是否设置成功了，在另一台连接了同一个路由器的电脑中用 SSH 连接： $ ssh USER@192.168.1.27，不出意外的话已经可以 SSH 进去了。下一步我们需要让它能被其它不在同一网络下的设备访问到。

配置路由器端口转发

如果你的运营商提供了公网 IP，比如 68.175.xxx.xx，那之后的问题就好办了，我们只需要在路由器上配置端口转发（Port Forwarding），这样就能够 $ ssh USER@68.175.xxx.xx 来访问 Ubuntu 电脑了。

因路由器的不同，需要在路由器中找到端口转发的设置项，将路由器接收到的 TCP / UDP 的 22 端口转发到子网 192.168.1.27 的 22 端口，也就是将 SSH 的连接直接转到 Ubuntu 机器上。示意图如下：

配置好了之后，将另一台电脑连接其它网络（如手机热点），通过 $ ssh USER@68.175.xxx.xx，如果遇到 ssh connection 的错误，可以重启 SSH 服务 $ sudo service ssh restart

配置 frp 反向代理

如果没有公网 IP，或者路由器不支持端口转发，或者像我以前在实验室一样，没有路由器的权限，这时候可以考虑用开源的 frp 配置反向代理。

和之前不一样的是，我们需要一个拥有公网 IP 的云服务器

在服务器端配置 frp 的 server 部分，然后在 Ubuntu 的电脑上配置 frp 的 client 部分，这样就在 Ubuntu 电脑和云服务器之间建立了连接。之后，其它电脑可以通过配置的端口 SSH 访问云服务器，frp 就会将连接转发到 Ubuntu 电脑上的相应端口。详细的配置这里不展开，frp 中文文档有非常详细的说明。

其它

在 Ubuntu 下，byobu 是非常好用的终端会话管理工具，万一 SSH 断开，你还可以重新连接并恢复之前的会话。

可以参考 How To Install and Use Byobu for Terminal Management on Ubuntu 16.04 的使用介绍。

Ubuntu 美化与终端配置

Fri, 12 Jun 2020 18:28:23 +0000

最近又需要用 Ubuntu 笔电作为主力开发机，于是又将系统配置了一遍。俗话说：“好看是第一生产力”，下面记录了我的主题、终端等工具的配置过程。

系统设置与美化

主题调整

原生的 Ubuntu 18.04 Gnome 界面的风格我个人不是非常喜欢，个人偏向于更加扁平的风格。以前在 Ubuntu 16.04 的时候，会使用 Flatabulous。但 Ubuntu 18.04 将默认的桌面环境从 Unity 换到了 GNOME，导致这个主题没法使用。好在有 Gnome Look 这个网站，上面有非常多的主题可供挑选。

首先我们需要安装 gnome-tweaks 工具：

1

sudo apt install gnome-tweaks

主题的话我目前用了 Mcata，一款仿 macOS Catalina 的主题。图标使用了非常精致好看的 Papirus 。鼠标指针采用了 McMojave cursors。这些主题的下载和使用也非常简单，对于主题只需下载后解压到 ~/.themes 目录下，图标和鼠标指针需解压到 ~/.icons 目录下，之后即可在 gnome-tweaks 工具中修改。

字体设置

系统字体使用 Google Noto 系列的字体，可以通过 apt 便捷的安装

1

sudo apt install fonts-noto

安装完成后即可在 gnome-tweaks 中将系统界面的字体设置为 Noto Sans Regular，需要中文显示支持就设置为思源黑体系列 Noto Sans CJK。

编程等宽字体可以使用上面安装好的 Noto Sans Mono 系列，当然我个人用的是 Meslo Nerd Font 中的 MesloLGM NF，支持 Powerline 的符号显示。

添加中文支持

假如你的系统是英文版的话，如果有中文输入的需求，首先在设置中找到语言选项，添加中文为第二语言，之后再在输入法设置里面添加汉语拼音。

终端配置

安装 zsh

首先安装 zsh 并通过 chsh 命令将其设置为默认的 Shell 环境。zsh 是和 Bash 一样最流行的终端命令解释器，已经成为了 macOS 10.15 Catalina 中默认的 Shell 了。

1
2
3
4
5
6
7
8


# 安装 zsh
sudo apt install zsh
# 确认 zsh 成功安装
which zsh
# 设置为默认 Shell
chsh -s /usr/bin/zsh

安装 Oh My Zsh

Oh My Zsh 是一个开源的“开箱即用”的 zsh 配置管理框架，安装之后可以很方便的为 zsh 安装主题、插件等，一行命令即可安装：

1

sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

配置 Zsh 主题

安装好 zsh 之后，继续设置其主题为 Powerlevel10k

1

git clone --depth=1 https://github.com/romkatv/powerlevel10k.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/themes/powerlevel10k

接着在 ~/.zshrc 中设置 ZSH_THEME="powerlevel10k/powerlevel10k"，重启 zsh 即可看见设置向导，按照提示可以选择自己喜欢的样式。

自动补全与语法高亮

Oh My Zsh 比较常用的两个插件是 zsh-autosuggestions 与 zsh-syntax-highlighting

1
2


git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions
git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting

安装完成后在 ~/.zshrc 中设置 plugins=(git zsh-autosuggestions zsh-syntax-highlighting)，重启终端后即可查看到效果。

配置颜色主题

Gnome 的 Terminal 可以在 Gogh 这个项目里找到合适的颜色主题，我选用了 OneDark

安装 Terminator

Terminator 是一个非常好用的终端管理软件，支持标签页以及像 tmux 一样分屏。如果需要开启多个终端、或者是连接多个远程服务器，Terminator 会是非常好用的工具。

1

sudo apt install terminator

编辑器配置

安装 Visual Studio Code

到 Visual Studio Code 官网下载安装 .deb 安装包，双击即可安装。VS Code 配合其丰富的插件，做到了开箱即用。同时在 Remote Development 的辅助下，能够便捷的在服务器、容器中进行开发。

安装 Vim

Ubuntu 是没有默认安装 Vim 的，因此需要手动安装

1

sudo apt install vim

安装完成后可以编辑 ~/.vimrc 文件来修改 Vim 的配置。还可以安装 vim-plug 给 Vim 添加插件支持

1
2


curl -fLo ~/.vim/autoload/plug.vim --create-dirs \
 https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim

安装 NeoVim

如果没有管理员权限，或者需要更现代的编辑器体验，不妨试试 NeoVim

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


# 下载 NeoVim
wget --quiet https://github.com/neovim/neovim/releases/download/nightly/nvim.appimage --output-document nvim
# 添加权限
chmod +x nvim
# 移动到系统路径
# 若没有权限，也可以直接添加到 PATH
sudo chown root:root nvim
sudo mv nvim /usr/bin
# 添加配置文件目录
# 配置文件将保存在 init.vim 中
mkdir -p ~/.config/nvim
# 安装 vim-plug
sh -c 'curl -fLo "${XDG_DATA_HOME:-$HOME/.local/share}"/nvim/site/autoload/plug.vim --create-dirs \
 https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim'

配置 Vim / NeoVim

这个之后打算再写一篇文章。在线的 VimConfig 可以帮助简单的调整 Vim 的设置。下面贴上我的配置，仅供参考

 1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161


"++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++"
" "
" __ _ _ _ __ ___ _ __ ___ "
" \ \ / / | '_ ` _ \| '__/ __| "
" \ V /| | | | | | | | | (__ "
" \_/ |_|_| |_| |_|_| \___| "
" "
" "
"++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++"


set langmenu=en_US " set to English menu
let $LANG = 'en_US'

set nocompatible " use Vim

filetype on " filetype
filetype plugin indent on

"=====================================================
""" Vim-plug settings
"=====================================================

call plug#begin('~/.vim/plugged')

Plug 'scrooloose/nerdtree' " nerdtree
Plug 'itchyny/lightline.vim' " status bar

Plug 'tpope/vim-fugitive' " git plugin

Plug 'sheerun/vim-polyglot' " language support
Plug 'mhinz/vim-startify' " start screen

Plug 'joshdick/onedark.vim' " color schemes
"Plug 'flazz/vim-colorschemes'

"Plug 'neoclide/coc.nvim', {'branch': 'release'}

call plug#end()

"=====================================================
"" General settings
"=====================================================

syntax on " syntax highlighting

set background=dark
colorscheme onedark " color scheme

set termguicolors
set cursorline

set encoding=utf-8 " file encoding

set number " show line numbers
set ruler
set ttyfast " terminal acceleration

set tabstop=4 " 4 whitespaces for tabs visual presentation
set shiftwidth=4 " shift lines by 4 spaces
set smarttab " set tabs for a shifttabs logic
set expandtab " expand tabs into spaces
set autoindent smartindent " indent when moving to the next line while writing code

set showmatch " shows matching part of bracket pairs (), [], {}
set matchpairs+=<:> " highlight match pairs

set magic " regular expression
set title " display title

set nobackup " no backup files
set nowritebackup " only in case you don't want a backup file while editing
set noswapfile " no swap files

set backspace=indent,eol,start " fix common backspace problems

set nowrap " line wrap
set history=1000 " history

set autoread " reload files when changed on disk, i.e. via `git checkout`
set shortmess=atI
set noshowmode
set showcmd

set selection=inclusive
set selectmode=mouse,key

set scrolloff=10 " let 10 lines before/after cursor during scroll

set clipboard+=unnamed " use system clipboard
set laststatus=2

set exrc " enable usage of additional .vimrc files from working directory
set secure " prohibit .vimrc files to execute shell, create files, etc...

set pastetoggle=<C-p> " toggle paste mode

"=====================================================
"" Search settings
"=====================================================

set incsearch " incremental search
set hlsearch " highlight search results
set ignorecase " ignore search cases
set smartcase " unless there is capital

"=====================================================
"" Plugin settings
"=====================================================

let g:lightline = {
 \ 'colorscheme': 'onedark',
 \ }

" Some key remapping
map <C-n> :NERDTreeToggle<CR>

"=====================================================
"" Keybindings
"=====================================================

inoremap <C-a> <Home>
inoremap <C-e> <End>
inoremap <C-v> <ESC>"+pa

" Quick Esc 
inoremap jj <Esc>
inoremap jk <Esc>

" Easy window navigation
nnoremap <C-J> <C-W>j
nnoremap <C-K> <C-W>k
nnoremap <C-L> <C-W>l
nnoremap <C-H> <C-W>h

" Quick yanking to the end of the line
nnoremap Y y$

" Jump to matching pairs easily, with Tab
nnoremap <Tab> %
vnoremap <Tab> %

" Folding
nnoremap <Space> za
vnoremap <Space> za

" Map ; to : and save a million keystrokes
" ex mode commands made easy 用于快速进入命令行
nnoremap ; :

" Shift+H goto head of the line, Shift+L goto end of the line
nnoremap H ^
nnoremap L $

" Tab
nnoremap <C-Left> :tabprevious<CR>
nnoremap <C-Right> :tabnext<CR>

" Auto indent pasted text
"nnoremap p p=`]<C-o>
"nnoremap P P=`]<C-o>

Go + gRPC 使用初探

Tue, 02 Jun 2020 19:28:23 +0000

gRPC 是一个高性能、开源和通用的 RPC 框架，基于 HTTP/2 传输协议，使用 Protocol Buffers 作为接口描述语言，支持众多的编程语言。在这篇文章里，我记录了如何从零开始，在 Windows 下，用 Docker 和 Go 搭建一个简单的 gRPC 示例。

关于 gRPC

gRPC 最初在2015年由Google开发。它使用 HTTP / 2 进行传输，并提供诸如身份验证，双向流和流控制，阻塞或非阻塞绑定以及取消和超时等功能。它为多种语言生成跨平台的客户端和服务器绑定。最常见的使用场景包括在微服务中连接服务风格的架构，并将移动设备，浏览器客户端连接到后端服务。

在 gRPC 里，客户端应用可以像调用本地对象一样直接调用另一台不同的机器上服务端应用的方法，使得创建分布式应用和服务变得更加容易。同时，只需要用 Protocol Buffers 定义接口与数据格式，gRPC 就可以生成各个语言下的请求与回复的函数定义，极大的简化了不同平台之间服务与客户端的开发流程。

Protocol Buffers

Protocol Buffers 是与语言无关，与平台无关的可扩展机制，用于对结构化数据进行序列化（例如 XML），但更小，更快，更简单。您定义要一次构造数据的方式，然后可以使用生成的特殊源代码轻松地使用各种语言在各种数据流中写入和读取结构化数据。

1
2
3
4
5


message Person {
 string name = 1;
 int32 id = 2;
 bool has_ponycopter = 3;
}

上面定义了一个简单的 Person 消息数据，按顺序分别有三个字段，因此编号了 1, 2, 3。proto3 官方文档提供了更详细的介绍与使用示例。

gRPC vs REST

主要的不同是 gRPC 使用了 Protobuf 作为数据传输格式，因为是二进制，所以体积更小，消耗资源更低。而 REST 一般用的是 JSON 格式，便于直观理解，但数据本身体积很大，而且解析需要更多计算资源。此外，gRPC 默认使用 HTTP/2，而很多 REST 采用的还是 HTTP/1。更多详细的不同可以参考 Compare gRPC services with HTTP APIs

环境设置

为了避免配置环境的麻烦，推荐使用 Docker 与 Visual Studio Code Remote - Containers，这样一来可以更便捷地在不同的容器环境中进行开发。在 Windows 下，安装 Docker Desktop 来启动 Docker 服务，我使用了 WSL 2 作为其引擎，更多关于 WSL 2 的可以参考我之前的文章升级到 WSL 2 开发环境。由于使用了 WSL 2，为了更快的文件访问速度，我选择把整个项目文件夹放在 WSL 2 下的文件夹内： $ mkdir ~/grpc-go。用到了 VS Code Remote Container 的插件来使 VS Code 能够支持在容器环境内开发。为了使得开发用到的容器环境具有一致性，需要使用 devcontainer.json 文件，可以参考 vscode-dev-containers/containers/go/ 下面的示例配置。先在 ~/grpc-go 下创建 .devcontainer 目录，并新建 Dockerfile 和 devcontainer.json 配置，直接复制 vscode-dev-containers/containers/go/ 中的配置即可，后面需要对 devcontainer.json 做一些修改。创建完成后的 grpc-go 目录如下：

1
2
3
4
5
6
7


➜ grpc-go tree -a
.
└── .devcontainer
├── Dockerfile
└── devcontainer.json
1 directory, 2 files

为了更方便的使用容器中的 GOPATH，在 devcontainer.json 中添加如下两行，将 WSL 中的 grpc-go 挂载到容器中的 /go/src/github.com/fing/ 目录下，方便后面模块的导入。

1
2


"workspaceMount": "source=${localWorkspaceFolder},target=/go/src/github.com/fing/${localWorkspaceFolderBasename},type=bind,consistency=cached",
"workspaceFolder": "/go/src/github.com/fing/${localWorkspaceFolderBasename}",

在配置好 grpc-go/.devcontainer/ 之后，按 F1 打开 VS Code 的命令界面，选择 Remote-Containers: Open Folder in Containers...，之后在打开的 Windows 文件选择框地址栏中输入 \\wsl$ 即可选择 WSL 中的文件夹打开。

你好 gRPC

在这个例子中将用 gRPC 创建一个简单的 greet 接口以及用 Go 实现服务和客户端。

安装 Protocol Buffer 编译器

因为这个容器的镜像是基于 Debian 的，因此可以使用熟悉的 apt install 来安装 protobuf-compiler

1
2
3


# Install protobuf compiler
apt update && apt install -y protobuf-compiler
protoc --version # Ensure compiler version is 3+

gRPC – Protocol Buffer Compiler Installation

安装 Go 模块

需要 gRPC 以及 protobuf 的 Go 插件：

1
2
3


# Install go plugins
go get -u google.golang.org/grpc
go get -u github.com/golang/protobuf/{proto, protoc-gen-go}

测试 protoc 编译

首先创建 protobuf 文件 grpc-go/greet/greetpb/greet.proto

1
2
3
4
5
6


syntax = "proto3";

package greet;
option go_package="greet/greetpb";

service GreetService {}

这里定义了了一个简单 service：GreetService，暂时将具体定义留白。使用 protoc 测试编译：

1

protoc greet/greetpb/greet.proto --go_out=plugins=grpc:.

编译完成后能在 greetpb 目录下看到生成好的 greet.pb.go 文件。

添加基本的 Server

首先在 greet 目录下新建 greet_server 文件夹并添加 greet/greet_server/server.go

1
2
3
4
5
6
7


package main
import "fmt"
func main() {
fmt.Println("Hello world!")
}

测试运行 go run greet/greet_server/server.go，能看到 Hello World! 的输出。接下来添加一下基本的 Server 框架。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28


package main
import (
"fmt"
"log"
"net"
"github.com/fing/grpc-go/greet/greetpb"
"google.golang.org/grpc"
)
type server struct{}
func main() {
fmt.Println("Hello world Server")
lis, err := net.Listen("tcp", ":50051")
if err != nil {
log.Fatalf("failed to listen: %v", err)
}
s := grpc.NewServer()
greetpb.RegisterGreetServiceServer(s, &server{})
if err := s.Serve(lis); err != nil {
log.Fatalf("failed to serve: %v", err)
}
}

要构建服务器，我们：

指定要用于侦听客户端请求的端口 lis, err := net.Listen("tcp", ":50051")
创建 gRPC 服务器的实例 grpc.NewServer()
在 gRPC 服务器上注册我们的服务实现 greetpb.RegisterGreetServiceServer(s, &server{})
调用服务器实例 Server() 来启动侦听

添加基本的 Client

同样的，创建 client.go

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22


package main
import (
"fmt"
"log"
"github.com/fing/grpc-go/greet/greetpb"
"google.golang.org/grpc"
)
func main() {
fmt.Println("Hello I'm client")
conn, err := grpc.Dial("localhost:50051", grpc.WithInsecure())
if err != nil {
log.Fatalf("did not connect: %v", err)
}
defer conn.Close()
c := greetpb.NewGreetServiceClient(conn)
fmt.Println("Created client: %f", c)
}

在这里，我们：

使用 grpc.Dial() 创建 gRPC channel
创建 GreetService 的客户端 greetpb.NewGreetServiceClient()

测试 Server 和 Client：我们可以用 go run 测试运行刚刚创建的 server.go 和 client.go，尽管我们并没有实现 GreetService 的具体细节，但这样可以测试是否能成功连接 gRPC 的服务器和客户端。

实现 Unary Call

Unary Call 顾名思义，就是简单的发送请求与回应。

定义 Request/Response 消息

在protobuf 文件 grpc-go/greet/greetpb/greet.proto 中添加不同的 message 以及声明 GreetService 中 RPC 函数 Greet()，使得它发送 GreetingRequest，并等待接收 GreetingResponse 的消息。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22


syntax = "proto3";

package greet;
option go_package="greet/greetpb";

message Greeting {
 string first_name = 1;
 string last_name = 2;
}

message GreetingRequest {
 Greeting greeting = 1;
}

message GreetingResponse {
 string result = 1;
}

service GreetService {
 // Unary
 rpc Greet(GreetingRequest) returns (GreetingResponse) {};
}

别忘了再次使用 protoc 编译我们修改过的 .proto 文件。

实现 RPC 函数

之后要在 server.go 中实现 Greet() 函数，我们可以从生成好的 greet.pb.go 中找到这个接口的定义

1
2
3


func (*UnimplementedGreetServiceServer) Greet(context.Context, *GreetingRequest) (*GreetingResponse, error) {
...
}

将其复制到 server.go 中，将具体的变量名放进去

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


func (*server) Greet(ctx context.Context, req *greetpb.GreetingRequest) (*greetpb.GreetingResponse, error) {
fmt.Printf("Greet function was invoked with %v", req)
firstName := req.GetGreeting().GetFirstName()
result := "Hello " + firstName
res := &greetpb.GreetingResponse{
Result: result,
}
return res, nil
}

之后可以在 client.go 里调用 Greet() 了。可以在 greet.pb.go 文件里找到函数的定义

1

Greet(ctx context.Context, in *GreetingRequest, opts ...grpc.CallOption)

在 client.go 的 main() 函数中创建 Request

1
2
3
4
5
6


req := &greetpb.GreetingRequest{
Greeting : &greetpb.Greeting {
FirstName: "James",
LastName: "Bond",
},
}

即可像下面一样调用 client 的 Greet() 并且传递 Request 信息

1

c.Greet(context.Background(), req)

之后再分别运行 server.go 和 client.go 即可看到 RPC 调用结果

1
2
3
4
5
6
7


root@d90ef922fdfd:/go/src/github.com/fing/grpc-go# go run greet/greet_server/server.go
Hello world Server
Greet function was invoked with greeting:{first_name:"James" last_name:"Bond"}
root@d90ef922fdfd:/go/src/github.com/fing/grpc-go# go run greet/greet_client/client.go
Hello I'm client
2020/06/04 04:25:24 Response from Greet: Hello James

附录

下面附上完整的代码，主要参考了官方的 Helloword 示例

client.go

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34


package main
import (
"context"
"fmt"
"log"
"github.com/fing/grpc-go/greet/greetpb"
"google.golang.org/grpc"
)
func main() {
fmt.Println("Hello I'm client")
conn, err := grpc.Dial("localhost:50051", grpc.WithInsecure())
if err != nil {
log.Fatalf("did not connect: %v", err)
}
defer conn.Close()
c := greetpb.NewGreetServiceClient(conn)
req := &greetpb.GreetingRequest{
Greeting: &greetpb.Greeting{
FirstName: "James",
LastName: "Bond",
},
}
res, err := c.Greet(context.Background(), req)
if err != nil {
log.Fatalf("could not greet: %v", err)
}
log.Printf("Response from Greet: %v", res.Result)
}

server.go

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40


package main
import (
"context"
"fmt"
"log"
"net"
"github.com/fing/grpc-go/greet/greetpb"
"google.golang.org/grpc"
)
type server struct{}
func (*server) Greet(ctx context.Context, req *greetpb.GreetingRequest) (*greetpb.GreetingResponse, error) {
fmt.Printf("Greet function was invoked with %v", req)
firstName := req.GetGreeting().GetFirstName()
result := "Hello " + firstName
res := &greetpb.GreetingResponse{
Result: result,
}
return res, nil
}
func main() {
fmt.Println("Hello world Server")
lis, err := net.Listen("tcp", ":50051")
if err != nil {
log.Fatalf("failed to listen: %v", err)
}
s := grpc.NewServer()
greetpb.RegisterGreetServiceServer(s, &server{})
if err := s.Serve(lis); err != nil {
log.Fatalf("failed to serve: %v", err)
}
}

参考链接：

升级到 WSL 2 开发环境

Wed, 27 May 2020 19:31:23 +0000

微软在今天正式向公众推出了 Windows 10 May 2020 Update（Version 2004），这个大版本的更新中一个比较重要的特性便是 Windows Subsystem for Linux 2（WSL 2）。

升级到 Windows 10 (version 2004)

首先需要升级到 Windows 10 version 2004。升级方法可以参考官方博客，在 Windows 10 的设置页面手动检查更新推送；或者也可以在 Download Windows10 页面下载升级助手或者 Media Creation Tool。我就是使用 Media Creation Tool 成功升级的。对于更新的详细信息，可以参考 Windows Blogs 或 Reddit 上的帖子，这里不再赘述。

升级到 WSL 2

确保 Windows 版本为 2004，Build 19041 或更高。详细的文档可以参考官方文档 Update to WSL 2。

在开始安装之前需要启用一个特性，桌面左下角右击，用管理员模式运行 PowerShell：

1

dism.exe /online /enable-feature /featurename:VirtualMachinePlatform /all /norestart

之后便可以将 WSL 2 设置为默认的版本：

1

wsl --set-default-version 2

如果你之前安装过了 WSL 1，可以用命令 wsl -l -v 查看所有已安装的发行版，并将它的 WSL 版本切换为 2：

1

wsl --set-version <distribution name> <versionNumber>

当然，也可以像我一样直接卸载之前的版本，需要用到 unregister：

1

wsl --unregister Ubuntu

之后再在商店中运行 Ubuntu，便会自动下载最新的 20.04 版本并像使用 WSL 1 一样重新设置用户名和密码。

WSL 2 与 WSL 1 的异同

简而言之，WSL 2 是运行在一个“迷你虚拟机”里 Linux 内核中的，因此是兼容 Linux 系统函数调用的。而 WSL 1 是将系统函数调用“翻译”成了 Windows 原生的函数调用。Comparing WSL 2 and WSL 1 中有详细的表格比较了两个版本的异同。

对于大多数使用场景，是推荐升级到 WSL 2 的。WSL 2 的构架虽然使用了虚拟机，但是能够完全支持 Linux 系统函数调用，并且利用 Linux ext4 文件系统，可以极大提升 WSL 的文件读写性能。官方说法是诸如 git clone 和 npm install 这样的命令性能会提升好几倍。同时，WSL 2 还支持 Docker，之后会介绍如何启用 Docker。

Docker in WSL 2

这里选择在 Windows 上安装最新版本的 Docker Desktop。下面两个博文详细地介绍了如何安装：

安装好之后在 Docker Desktop 的设置里启用 Use the WSL 2 based Engine：

之后便可以在 WSL 中看到 Docker 的版本。需要注意的是 WSL 中的 Docker 应该只是挂载进去的二进制文件，在 Docker Desktop 退出之后是看不到的，因此需要保持 Docker Desktop 的运行。

之后就可以在 Windows 或者在 WSL 下面运行 Docker 命令启动容器了。比如下面我简单的几个命令就能 pull 一个 golang 的环境。省去了在 Windows 亦或是 WSL 里配置环境的麻烦。

VS Code 与 WSL 2

此外，还可以利用 Visual Studio 的 Remote Development 插件，可以非常方便的用 VS Code 在 Container 环境里进行开发。具体可以参考 Developing inside a Container。

未来的 WSL

WSL 团队在博客中表示未来还计划支持 GPU 加速以及运行 Linux GUI 程序。

参考：

域名和 DNS 二三事

Sat, 16 May 2020 13:39:23 +0000

昨天上午又冲动消费了，买了一个新的域名 fuxin.me，简短好记。其实从最开始打算搭网站到现在，一路也换过不同的域名、服务器以及 DNS 提供商，下面来简要谈谈这些。

域名名称

一开始的我的域名和服务器是通过腾讯云+校园的活动入坑的。这个活动在 2015 年时是每月 1 元的服务器加送 .cn 的域名。所以就注册了一个 fingr8.cn 的域名（现在已弃用），国内的网站服务器还需要非常费劲的备案。后来随着参与活动的国内学生人数变多，这个活动也变得越来越抠门。

对于域名名称选择，我个人的想法是这样子的：第一是尽量选择顶级域名 .com，更常见以及价格更实惠。像 .cn 这种域名太具有地理标签了，不是非常适合用作个人域名。此外 .me 也非常适合用于个人页面。一般常见的技术主页还会用 .dev、.io 等作为结尾。第二是域名需简短好记。需要在“短”和“好记”之间达到平衡。像我之前的域名 fingr8.cn，它虽然短，但域名中混杂了英文 + 数字，在一定程度上不利于其他人的记忆。我现在使用的域名 imfing.com 的前缀意为 I'm Fing，一定程度上也算好记。而新购的 fuxin.me 就是非常体现个人色彩的一个域名了。我推荐搭建个人主页的话可以使用 名字 / 昵称 + .com / .me 这样的组合。

域名提供商

域名提供商简而言之就是卖给你域名的商家。国内的话诸如腾讯云、阿里云都会提供域名的购买和免费的解析服务。

国内提供商托管的域名可以不备案么？答案是可以，前提是你域名指向的服务器空间不在国内。国内的主机空间只要被解析，则对应的域名必须要备案。为了省去备案的麻烦，通常不会首选国内域名提供商以及主机空间。

下面是几个我推荐的域名提供商：

NameSilo - 综合性价比较高，提供免费的 WHOIS 隐私保护。我的域名就是在这里购买的
NameCheap - 使用 GitHub 学生包可以免费注册一年的 .me 域名
Google Domains - Google 爸爸的域名服务，价格较贵，有各种各样花式的结尾
GoDaddy - 老牌域名商，续费感觉比较坑，不知道现在怎么样了

域名是可以在不同的提供商之间转入转出的，因此如果你觉得续费坑的话就可以将域名转出到其它提供商。

DNS 解析

当在访问一个域名的时候，浏览器是不知道这个域名指向的服务器 IP 地址的，因此就需要 DNS 服务来解析。一部分的域名提供商都会提供域名解析服务，比如腾讯就是用自家的 DNSPod。这里肯定要推荐 Cloudflare，不仅提供了免费的域名解析（DNS）和内容分发网络（CDN），还自带安全保护、HTTPS 等。在购买了域名之后，只需按照 Cloudflare 的提示将 NS（Name Server）的记录指向 Cloudflare 即可。

在搭建个人网站时，一搬会选择搭建静态网站，即不需要云服务器来存取和提供数据。因此可以利用 Netlify 或 GitHub Pages 来托管网站的网页文件，再在 DNS 服务商里添加 CNAME 记录（就是一个 Alias），指向对应的网址即可。比如我现在的 fuxin.me 其实是指向了 imfing.com 的。静态网站还可以利用 Cloudflare 的 CDN 来加速用户的访问。如果你有服务器的话则需要添加 A 记录，指向一个确定的 IP 地址。这个动画生动解释了 DNS 是如何工作的：How DNS works。

云服务器提供商

下面列举一些常用的云服务器提供商，想搭建梯子或者简单 Web 应用的可以参考：

VPS 虚拟主机（适用小型网站及应用）
- Digital Ocean - GitHub 学生优惠 50 刀。
- Amazon Lightsail
- Linode
- Vultr
云计算主机
- Amazon AWS - 免费试用，也可用 GitHub 学生优惠
- Microsoft Azure - 免费试用，也可用 GitHub 学生优惠
- Google Cloud - 300$ 的免费试用

中英文混排的“Social Distancing”

Fri, 15 May 2020 23:39:23 +0000

我是从去年开始才注意到中英文混合排版时候的空格问题的。当时正在完成我的毕业论文，就发现中英文之间是需要一定的距离才能够更方便阅读者的阅读。加上最近疫情期间北美强调“Social Distancing”这个概念，遂借来描述一下中英文混排中需要注意添加空格的习惯。

盘古之白

之前有在少数派看到「为什么你们就是不能加个空格呢？」，其中介绍到了 pangu.js 的项目，它提供了 Chrome 插件自动在网页中英文之间插入空格，并且也提供了 Go、JavaScript、Python 等语言下的模块帮助自动格式化中英文片段。

漢學家稱這個空白字元為「盤古之白」，因為它劈開了全形字和半形字之間的混沌。另有研究顯示，打字的時候不喜歡在中文和英文之間加空格的人，感情路都走得很辛苦，有七成的比例會在 34 歲的時候跟自己不愛的人結婚，而其餘三成的人最後只能把遺產留給自己的貓。畢竟愛情跟書寫都需要適時地留白。

空格规则

下面表格总结了在哪些情况下需要使用到空格。当然，这个规则也只是作为参考，比如超链接空格等规则是有待商榷的，以习惯为准。

搭配	规则	示例
中文与英文	需空格	我使用 Google 搜索引擎
中文与数字	需空格	今天 20 摄氏度
英文与数字	需空格	最近更新了 iOS 13.5 版本的系统
数字与单位	需空格	香蕉 1.99 美元一磅
数字与百分比	无需空格	谷歌浏览器市场占比高达 58.4% 了
日期	无需空格	今天是2020年1月1日
全角标点与字符	无需空格	喂！你在干什么？！
省略号	后需空格	这…… 有问题吗
全角括号	无需空格	全角括号（示例），禁止(半角无空格)或者 (半角加空格) 写法
超链接	需空格	参考这里的示例

网页工具

道理都懂，但是之前书写的时候并没有注意到这些。借助于 pangu.js，我写了一个简单的 HTML 网页，用来帮我给之前文章自动化添加空格，并且复制到剪贴板上。当然，pangu.js 在格式化 Markdown 书写的文字时候，会破坏 Markdown 的一些标记，譬如 **加粗** 会变成 ** 加粗 **。因此还是平时打字的时候养成随手加空格的习惯比较重要。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Text Spacing Tool</title>
<script src="https://cdn.jsdelivr.net/npm/pangu@4.0.7/dist/browser/pangu.min.js"></script>
<link href="https://unpkg.com/@primer/css/dist/primer.css" rel="stylesheet" />
<style>
.input-container {
margin-top: 3rem;
display: flex;
align-items: center;
flex-direction: column;
}
.form-control {
min-width: 30rem;
min-height: 15rem;
margin-bottom: 2rem;
}
</style>
</head>
<body>
<h1 style="text-align: center; margin-top: 3rem;">Text Spacing Tool</h1>
<div class="input-container">
<label>Before</label> <textarea class="form-control" id="input-textarea"></textarea>
<label>After</label> <textarea class="form-control" id="output-textarea"></textarea>
</div>
<script>
var inputText = document.getElementById('input-textarea');
var outputText = document.getElementById('output-textarea');
window.addEventListener('load', () => { inputText.focus(); })
inputText.addEventListener('input', () => {
outputText.value = pangu.spacing(inputText.value);
outputText.select();
document.execCommand("copy");
inputText.select();
});
</script>
</body>
</html>

参考：

PyTorch 简单分类模型示例

Sat, 09 May 2020 18:09:00 +0000

之前实习的时候 PyTorch 用的非常多。PyTorch 的优势是非常灵活，语法非常 pythonic，很接近 NumPy。动态图的特性也让调试变得比 TensorFlow 轻松许多。不过对于作业 / Kaggle 中相对简单的分类任务，Keras 还是我的第一选择：开箱即用，并且和 scikit-learn 有着类似的接口，因此只需少量的代码即可实现模型的训练和迭代。而在 PyTorch 中，很多相似的功能都需要自己手动多写几行代码，对我这个懒人不太友好。在帮朋友解决问题的时候，发现对 PyTorch 有些生疏，而且官方的例子里并没有具体的例子讲述如何用 NumPy 的数据作为数据集，于是这里便记录一下，方便以后参考。

导入库

第一步是需要导入各种库

1
2
3
4


import torch
import torch.nn as nn
import torch.nn.functional as F
import torch.optim as optim

数据集加载

比较 tricky 的就是构建 PyTorch 中的 Dataset 和 DataLoader 了。虽然非常好用，比如可以自定义实现 DataLoader、Transform 等，但刚上手的时候容易出错。在用 train_test_split 将 NumPy 数据集划分好后，第一步需要将它们转换为 PyTorch 中的 Tensor，之后用 TensorDataset 创建 Dataset 对象，最后用 DataLoader 创建数据集加载器，之后在训练中会需要用到。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


# Construct PyTorch dataset
BATCH_SIZE = 4
X_train_tensor = torch.from_numpy(X_train)
y_train_tensor = torch.from_numpy(y_train).type(torch.LongTensor)
print(X_train_tensor.shape, y_train_tensor.shape)
train_dataset = torch.utils.data.TensorDataset(X_train_tensor, y_train_tensor)
train_loader = torch.utils.data.DataLoader(train_dataset,
batch_size=BATCH_SIZE,
shuffle=True,
num_workers=2)

构建模型

下面定义一个简单的 ConvNet 类，里面实现了一个两层的 CNN。在 __init__() 里定义一些层并实现了 forward() 前向传播。因为 PyTorch 是动态图计算，因此不需要手动定义反向传播的计算过程。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21


class ConvNet(nn.Module):
def __init__(self):
super(ConvNet, self).__init__()
self.conv1 = nn.Conv1d(in_channels=2,
out_channels=16,
kernel_size=3,
padding=1)
self.conv2 = nn.Conv1d(in_channels=16,
out_channels=32,
kernel_size=3,
padding=1)
self.pool = nn.MaxPool1d(2)
self.fc1 = nn.Linear(32*256, 10)
def forward(self, x):
x = self.pool(F.relu(self.conv1(x)))
x = self.pool(F.relu(self.conv2(x)))
x = x.view(-1, 32*256)
output = self.fc1(x)
return output

之后可以用 torch-summary 或 tensorwatch 输出模型每一层的参数：

1
2
3
4


model = ConvNet()
from torchsummary import summary
summary(model, input_size=(2, 1024))

可以得到如下的输出：

----------------------------------------------------------------
Layer (type) Output Shape Param #
================================================================
Conv1d-1 [-1, 16, 1024] 112
MaxPool1d-2 [-1, 16, 512] 0
Conv1d-3 [-1, 32, 512] 1,568
MaxPool1d-4 [-1, 32, 256] 0
Linear-5 [-1, 10] 81,930
================================================================
Total params: 83,610
Trainable params: 83,610
Non-trainable params: 0
----------------------------------------------------------------
Input size (MB): 0.01
Forward/backward pass size (MB): 0.38
Params size (MB): 0.32
Estimated Total Size (MB): 0.70
----------------------------------------------------------------

因为是多分类任务，所以使用了 torch.nn.CrossEntropyLoss()，需要注意的是其中包含了 Softmax 因此我们不需要在网络中手动实现。优化器选择了 torch.optim.Adam，并设置学习速率为常见的 0.001。

1
2
3
4


# Optimizer and criterion
criterion = nn.CrossEntropyLoss()
optimizer = optim.Adam(model.parameters(), lr=0.001)

训练

最后我们就能实现模型训练过程，最外面是循环 EPOCHS 次，每个 epoch 中定义累积的 running_loss，前面定义的 train_loader 一次能够给出 BATCH_SIZE 的训练样本，在内循环中就能够得到训练数据并进行前向计算、计算 loss、计算梯度、优化器迭代更新整个模型的参数。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28


# Training

EPOCHS = 1
for epoch in range(EPOCHS):
model.train()
running_loss = 0.0
for batch_idx, data in enumerate(train_loader):
# get inputs and labels
 inputs, labels = data
# zero the parameter gradients
 optimizer.zero_grad()
# forward + backward + optimize
 outputs = model(inputs)
loss = criterion(outputs, labels)
loss.backward()
optimizer.step()
# print statistics
 running_loss += loss.item()
if (batch_idx+1) % 1000 == 0:
print('Epoch [{}/{}], Step [{}/{}], Loss: {:.4f}'
.format(epoch+1, EPOCHS, batch_idx+1, len(train_loader), loss.item()))

输出：

1
2
3
4
5
6


Epoch [1/1], Step [1000/6750], Loss: 2.1528
Epoch [1/1], Step [2000/6750], Loss: 1.2026
Epoch [1/1], Step [3000/6750], Loss: 1.7215
Epoch [1/1], Step [4000/6750], Loss: 1.8674
Epoch [1/1], Step [5000/6750], Loss: 1.6417
Epoch [1/1], Step [6000/6750], Loss: 1.1279

GPU 训练

如果要用 GPU 训练，需要指定 device，并且将模型以及每个 Batch 的数据都传到 GPU device 中，在上面的基础上改动或添加以下的代码：

1
2
3
4
5


device = torch.device("cuda:0" if torch.cuda.is_available() else "cpu")
model.to(device)
inputs, labels = data[0].to(device), data[1].to(device)

PyTorch Recipes 里给出了更多常用的例子，包括保存 / 读取模型、使用 Tensorboard 等，可以进一步参考。

参考链接

CUDA C++ 实现图像处理

Fri, 08 May 2020 20:30:23 +0000

最近课程里面有用到 NVIDIA CUDA 框架进行并行编程，实现了一些非常基本的图像处理的操作。使用 CUDA 实现的并行加速能够极大的提升图像处理的效率，这也是为什么近几年的深度学习框架都要依托于 CUDA 进行计算加速。CUDA 本质上是 C/C++ 的拓展，因此对 C/C++ 熟悉的话上手也会很快。

读取保存图像

C++ 中读取图像和保存图像不像 Python 那样方便简单。一开始我想用 OpenCV 来读取/写入图像，但对于我写一个小的示例程序来说可谓麻烦了些，涉及到编译的问题。后来看到了 lodepng 这个小巧方便的库，支持 C 和 C++，使用时只需要引用一个头文件就可以。读取和保存文件只需要如下的几行代码：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


#include "lodepng.h"

// Read image
std::vector<unsigned char> image;
unsigned int width, height;
unsigned error = lodepng::decode(image, width, height, input_file);
// Save image
std::vector<unsigned char> out_image(image.size(), 255);
error = lodepng::encode(output_file, out_image, width, height);

加载好的图片像素有 4 个通道，按照 RGBARGBA... 的顺序在一维数组中排列的，其中 A 表示的是透明度，0 表示全透明，255 则完全显示当前像素。

CUDA Kernel

CUDA 并行部分的代码需要单独用 __global__ 关键词进行修饰，这一部分的代码会在 device 上执行。NVIDIA 自家的博文 An Even Easier Introduction to CUDA 就通俗易懂的介绍了 CUDA 的一些基本概念。CUDA C++ Programming Guide 有更为全面和详细的例子与参考。

下面是我实现的 RGB 转 Grayscale 的 Kernel 并行代码：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


// CUDA Kernel
__global__ void RGB2GrayKernel(unsigned char* input_image,
unsigned char* output_image,
int width, int height) {
// input_image size: width*height*Channels
 // output_image size: width*height

int row = blockIdx.y * blockDim.y + threadIdx.y;
int col = blockIdx.x * blockDim.x + threadIdx.x;
if ((row < height) && (col < width)) {
// Offset in Grayscale image
 int offset = row*width + col;
// Get RGB values
 unsigned char r = input_image[offset * CHANNELS + 0];
unsigned char g = input_image[offset * CHANNELS + 1];
unsigned char b = input_image[offset * CHANNELS + 2];
// Convert to grayscale
 output_image[offset] = 0.2126f*r + 0.7152f*g + 0.0722f*b;
}
}

通过 CUDA Kernel 全局变量 blockDim、blockIdx 以及 threadIdx，可以得到当前运行 Kernel 的线程的编号，这样能够方便的访问部分数据。

在 CPU(host) 部分的 main 函数中，我们需要将图片数据拷贝到 device 上的 global memory 中，需要用到 cudaMalloc 以及 cudaMemcpy：

1
2
3
4
5
6
7
8


// Allocate memory for CUDA device
size_t mem_size = width * height * sizeof(unsigned char);
unsigned char* dev_input, *dev_output;
cudaMalloc(&dev_input, mem_size * CHANNELS);
cudaMemcpy(dev_input, image.data(), mem_size * CHANNELS, cudaMemcpyHostToDevice);
cudaMalloc(&dev_output, mem_size);

在 main 中调用 CUDA Kernel 的时候，需要用到尖括号的表达。下面在一个 Block 里我用了 16x16 个线程，然后对于 width x height 的图像，可以得到所需的 Grid 的 Size，使得整个图片能被所有的线程都处理到。

1
2
3
4
5
6
7


#define BLOCK_SIZE 16

// Invoke CUDA kernel
dim3 dimBlock(BLOCK_SIZE, BLOCK_SIZE);
dim3 dimGrid(width / dimBlock.x, height / dimBlock.y);
RGB2GrayKernel<<<dimGrid, dimBlock>>>(dev_input, dev_output, width, height);

在调用完 Kernel 之后，我们需要将 CUDA device 内存中的数据拷贝到 CPU 上 main 程序里，这样可以在后续使用 lodepng 将图片保存。最后不能忘记用 cudaFree 将分配的 GPU 显存给释放。

1
2
3
4
5
6


// Copy output from device
unsigned char* image_y = new unsigned char[width*height];
cudaMemcpy(image_y, dev_output, mem_size, cudaMemcpyDeviceToHost);
cudaFree(dev_input);
cudaFree(dev_output);

Timing

使用 CUDA C++ 的接口可以方便的计算运行时间，无论是否是 CUDA Kernel 代码：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20


#include "cuda_runtime.h"

// Timing
cudaEvent_t start, stop;
cudaEventCreate(&start);
cudaEventCreate(&stop);
cudaEventRecord(start);
//
// DO SOMETHING
// WITH OR WITHOUT CUDA
//

// Get elapsed time in ms
cudaEventRecord(stop);
cudaEventSynchronize(stop);
float milliseconds = 0;
cudaEventElapsedTime(&milliseconds, start, stop);

编译

编译需要用到 CUDA 库中的 NVIDIA CUDA Compiler (NVCC)，在编译的时候注意 GPU 的架构，需要指定 -arch=compute_35 参数，具体的列表可以在 GPU Feature List 里查看。下面我写了一个非常简单的 makefile 文件，写了一个 rgb2gray_cuda 的规则来使用系统中的 CUDA 10 下的 nvcc 来编译我的 rgb2gray.cu 源码。

1
2
3
4
5
6
7
8


NVCC ?= /usr/local/cuda-10.1/bin/nvcc
NVCCFLAGS ?= -arch=compute_35
rgb2gray_cuda:
$(NVCC) $(NVCCFLAGS) -o rgb2gray_cuda.out rgb2gray.cu lodepng.cpp
clean:
rm -f *.out

编译时只需要执行 $ make rgb2gray_cuda，即可生成 rgb2gray_cuda.out 可执行文件。可以通过 $ make clean 清除所有编译产生的 .out 文件。

Histogram 与 AtomicAdd

在做直方图统计的时候，多个线程会同时访问直方图结果的数列，为了避免 race condition，需要用到 CUDA 的 atomicAdd 函数：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


// CUDA Kernel
__global__ void HistogramKernel(unsigned char* d_image, unsigned int* d_histo, int width, int height) {
// input_image size: width*height

int row = blockIdx.y * blockDim.y + threadIdx.y;
int col = blockIdx.x * blockDim.x + threadIdx.x;
if ((row < height) && (col < width)) {
int id = row*width + col;
atomicAdd(&d_histo[d_image[id]], 1);
}
}

进一步的，可以使用 shared memory 来提升性能。Using Shared Memory in CUDA C/C++ 中给出了一些介绍及基本的例子。

附上完整 rgb2gray.cu 代码：

 1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100


/*
 * Convert RGB image to grayscale
 *
 * Load image with lodepng (https://github.com/lvandeve/lodepng)
 *
 * Sample image: lena.png
 *
 * Y = 0.2126*R + 0.7152*G + 0.0722*B
 *
 * */
#include <iostream>
#include <string>

#include "cuda_runtime.h"
#include "lodepng.h"

#define CHANNELS 4 // RGBA in PNG
#define BLOCK_SIZE 16 // Thread block size

// CUDA Kernel
__global__ void RGB2GrayKernel(unsigned char* input_image,
unsigned char* output_image,
int width, int height) {
// input_image size: width*height*Channels
 // output_image size: width*height

int row = blockIdx.y * blockDim.y + threadIdx.y;
int col = blockIdx.x * blockDim.x + threadIdx.x;
if ((row < height) && (col < width)) {
// Offset in Grayscale image
 int offset = row*width + col;
// Get RGB values
 unsigned char r = input_image[offset * CHANNELS + 0];
unsigned char g = input_image[offset * CHANNELS + 1];
unsigned char b = input_image[offset * CHANNELS + 2];
// Convert to grayscale
 output_image[offset] = 0.2126f*r + 0.7152f*g + 0.0722f*b;
}
}
/* Main */
int main(int argc, char* argv[]) {
const char* input_file = argc > 1 ? argv[1] : "lena.png";
// Variables
 std::vector<unsigned char> image;
unsigned int width, height;
// Load image
 unsigned error = lodepng::decode(image, width, height, input_file);
std::cout << width << " x " << height << std::endl;
// Allocate memory for CUDA device
 size_t mem_size = width * height * sizeof(unsigned char);
unsigned char* dev_input, *dev_output;
cudaMalloc(&dev_input, mem_size * CHANNELS);
cudaMemcpy(dev_input, image.data(), mem_size * CHANNELS, cudaMemcpyHostToDevice);
cudaMalloc(&dev_output, mem_size);
// Invoke CUDA kernel
 dim3 dimBlock(BLOCK_SIZE, BLOCK_SIZE);
dim3 dimGrid(width / dimBlock.x, height / dimBlock.y);
RGB2GrayKernel<<<dimGrid, dimBlock>>>(dev_input, dev_output,
width, height);
// Copy output from device
 unsigned char* image_y = new unsigned char[width*height];
cudaMemcpy(image_y, dev_output, mem_size, cudaMemcpyDeviceToHost);
cudaFree(dev_input);
cudaFree(dev_output);
// Prepare for output
 std::vector<unsigned char> out_image(image.size(), 255);
for (size_t i = 0; i < width*height; i++) {
size_t offset = i * CHANNELS;
out_image[offset + 0] = out_image[offset + 1] = out_image[offset + 2] = image_y[i];
}
// Save processed image
 std::string output_file(input_file);
output_file += ".gray.png";
error = lodepng::encode(output_file, out_image, width, height);
delete[] image_y;
return 0;
}

部分参考链接：

从 Blogger 回到 Hexo

Thu, 07 May 2020 18:09:00 +0000

真是啪啪打脸。在决定把原来用 Hexo 搭建的静态博客搬到 Google Blogger 三个多月之后，实在无法忍受 Blogger 糟糕的写作体验，尤其是 Markdown 及 Code，于是就还是回到了 Hexo 的怀抱。先来说说之前把博客搬到 Blogger 主要原因：图床问题以及跨平台写作的便捷性。那既然打算继续用静态博客，就需要解决这些小问题。

博客配图管理

使用图床是因为不想让博客的 Git 仓库过于臃肿。对于图床，之前一直是用 PicGo 这样的工具上传到新浪微博图床。但后来在 2019 年 4 月之后新浪微博开始防盗链，之前许多上传了的图片都没法显示，让人很是抓狂。使用其它图床服务的话，也会面临相似的问题。所以博客中的图片还是得老实放在 Git 仓库中，利用 Hexo 的 Post Asset Folder 特性可以比较便捷地管理博文的配图。此外还可以利用 Issue 中能上传图片的功能将图片上传到 GitHub 的 CDN。这一点我经常在我 Repo 的 README 中用到。

跨平台写作及部署

静态博客不像 Blogger 或 WordPress 那样提供了一个网页端的后台可以随时随地写作和管理自己的博文。因此用静态博客写作的最大障碍就是你需要有一台电脑并配置好 NodeJS 和 Hexo 的环境，否则是无法预览写好文章的显示效果。这也是我所看到的许多静态博客博主只有寥寥几篇的博文便停更了。现在我的解决方案是用 StackEdit，一个基于浏览器的 Markdown 编辑器，可以选择将数据保存在 Google 账户、GitHub、GitLab、Google Drive 等地方并同步。这样随时随地我都能够用 Markdown 写作并预览文章。需要发布文章时就可以直接将 .md 文件下载到本地亦或直接在 GitHub 上创建并发布。

博客的所有源文件都放在了 GitHub 的私有仓库中。部署的话我还是像之前一样用 Netlify。当我的更新 Push 到 GitHub 仓库里时，Netlify 会自动拉取并构建部署，我只需将自己的博客域名 CNAME 到 Netlify 中的子域名，HTTPS 也会自动支持。相类似的服务还有 Vercel （之前叫做 ZEIT），和 Netlify 如出一辙。GitHub Pages 当然也是很好的部署方案，相对于 Netlify 来说还是稍微麻烦了一些。

Hexo 主题与配置

之前博客用了”烂大街“的 NexT 主题。十有八九 Hexo 静态博客都用了这个主题，虽然功能丰富、风格简约，但不免还是有些视觉疲劳。hexo-theme-icarus 也是一个非常好看并且支持很多自定义配置的主题，此外还有 hexo-theme-minos。后来我选择了用 Cactus，一个非常简约美观的主题。不需要太多很 fancy 的设置，把重心放到博文本身上来。以后想要迁移到其它的主题也可以的。

由于我的博文中偶尔会需要用到 LaTeX 数学公式，因此我添加了 MathJax，可以参考这里，将 <script> tag 添加到主题中即可。这样在加载文章时就会自动通过 CDN 加载 MathJax 并渲染页面中的数学公式。唯一需要注意的是数学公式中的一些特殊符号需要 escape 否则会和 Markdown 的语法冲突。可以启用主题中的 Google Analytics，方便统计访问者等。博文评论使用了 Disqus，也可以在主题中设置。为了更好的支持 SEO，用官方的 hexo-generator-sitemap 即可添加 sitemap.xml。

后记

从本科大一刚开始决定搭建博客只是觉得好玩和想实践一下搭建网站，到现在陆陆续续写了大概二十多篇文章，心态也发生了很大的转变，更多的是为了记录。不管是不是技术相关的内容，不强求关注和访问量，笔耕不辍，日后再回顾会别有一番趣味。

Windows 下终端及工具配置

Fri, 17 Apr 2020 20:08:23 +0000

写这篇文章的主要目的是总结一下我目前在 Windows 上使用的命令行终端和 Shell 的配置，让自己拥有有更舒适愉悦的使用体验。

Powershell 美化与配置

在 Windows 下会时常用到 Powershell 来进行一些简单的命令行操作，比如使用 Python、Node 等。然而系统自带的 Powershell 丑的不忍直视，为了让自己用它的时候拥有更加愉悦的心情，得稍微折腾一下。在 Linux 环境下有大名鼎鼎的 oh-my-zsh，于是 Windows 下便也诞生了 oh-my-posh ，用来美化 Powershell。

安装的方法也非常简单，确保你已经安装了 Git 客户端。首先打开 Powershell 输入以下指令安装 posh-git 以及 oh-my-posh

1
2


Install-Module posh-git -Scope CurrentUser
Install-Module oh-my-posh -Scope CurrentUser

之后运行命令 notepad $PROFILE 来打开默认的配置文件，并在最后加上：

1
2
3


Import-Module posh-git
Import-Module oh-my-posh
Set-Theme Paradox

这样便能启用之前安装的两个插件，以及将主题设置为了 Paradox。oh-my-posh 还支持其它的一些主题。

除此之外，为了一些特殊的符号的显示正常，我们还需要 Powerline 字体，才可以得到和上图一样的效果。这里不得不推荐一下微软官方的开源字体 Cascadia Code，在 Windows Terminal 中将 fontFace 设置成 Cascadia Code PL 即可。其它的还有 Powerline fonts 和 Nerd-fonts

Windows Terminal 的配置

从去年 Build 大会发布以来，Windows Terminal 就一直在 GitHub 上积极的迭代，功能也日渐完善，现在它已经是我在 Windows 环境下的主力终端了。

目前 Windows Terminal 还没有可视化的设置界面，需要通过手动编辑配置文件才能修改配置。可以参考它的 SettingSchema 来增删配置。这里也有一份修改官方的修改教程：Editing Windows Terminal JSON Settings。

我将全局的字体修改为了 "Cascadia Code PL" 以及将字号调整成了 12。

1
2
3
4
5
6


"defaults":
{
// Put settings here that you want to apply to all profiles
"fontFace" : "Cascadia Code PL",
"fontSize" : 12
}

我更加喜欢 "One Half Dark" 的主题。内置主题的话可以在 ColorTool 里面的 schemes 里找到，也可以自己在配置文件的 schemes 块添加自己的主题，如 dracula。

1
2
3
4
5
6
7
8
9


{
// Make changes here to the powershell.exe profile
"guid": "{61c54bbd-c2c6-5271-96e7-009a87ff44bf}",
"name": "PowerShell",
"commandline": "powershell.exe",
"hidden": false,
"colorScheme" : "One Half Dark",
"startingDirectory" : "."
},

在 keybindings 区域可以添加一些常用的快捷键。

1
2
3
4
5
6
7


// Add any keybinding overrides to this array.
// To unbind a default keybinding, set the command to "unbound"
"keybindings": [
{ "command": "copy", "keys": ["ctrl+shift+c"] },
{ "command": "paste", "keys": ["ctrl+shift+v"] },
{ "command": {"action": "splitPane", "split": "auto"}, "keys": ["ctrl+|"]}
]

为了能够更方便的使用，还可以在系统右键添加全局的 "Open Terminal Here" 的菜单。这样一来，在任何文件夹里面可以方便的打开 Terminal 并且定位到那个文件夹下面。可以在 GitHub 上的这个 Issue 里找到一些社区用户提供的方法。

创建一个 reg 文件，将下面内容中的 <user> 改为你用户的名字后，保存并执行即可。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15


Windows Registry Editor Version 5.00
[HKEY_CLASSES_ROOT\Directory\Background\shell\wt]
@="Windows Terminal here"
"Icon"="C:\\Program Files\\WindowsApps\\Microsoft.WindowsTerminal_0.10.781.0_x64__8wekyb3d8bbwe\\WindowsTerminal.exe"
[HKEY_CLASSES_ROOT\Directory\Background\shell\wt\command]
@="C:\\Users\\<user>\\AppData\\Local\\Microsoft\\WindowsApps\\wt.exe -d ."
[HKEY_CLASSES_ROOT\Directory\shell\wt]
@="Windows Terminal here"
"Icon"="C:\\Program Files\\WindowsApps\\Microsoft.WindowsTerminal_0.10.781.0_x64__8wekyb3d8bbwe\\WindowsTerminal.exe"
[HKEY_CLASSES_ROOT\Directory\shell\wt\command]
@="C:\\Users\\<user>\\AppData\\Local\\Microsoft\\WindowsApps\\wt.exe -d ."

WSL 的配置

在不少时候需要用暂时到 Linux 的环境。众所周知，在 Windows Subsystem for Linux (WSL) 问世之后，Linux "真的变成了" Windows 的一个"子系统"了。之前有使用过 oh-my-zsh 但是 zsh 的启动速度过于感人，就转而改用了开箱即用的 fish-shell。

这里以在 Ubuntu 环境下为例。安装 fish-shell 非常简单，只需要执行 sudo apt install fish 即可。之后继续安装 oh-my-fish：curl -L https://get.oh-my.fish | fish。之后可以通过 omf theme 来查看主题，omf install <theme> 来安装主题。

想要默认启动 fish shell 的话需要在 ~/.bashrc 文件最后加上fish。

参考

在 Blogger 中使用 Markdown

Wed, 15 Apr 2020 20:04:51 +0000

最近有陆陆续续开始写一些东西，不过 Google Blogger 编辑体验非常非常糟糕。只好求助 Google 一下有没有能够使用 Markdown 编辑的方法，果然有人分享了如何在 Blogger 里使用 Markdown。思路其实很简单，借助于 showdown，动态地将 Mardown 内容转换为用于显示的 HTML。

之前把旧的博客里面的 Markdown 写的博文导入到 Blogger 时费了一番功夫，花了很多时间将 Markdown 转换为 HTML。其实都可以借助现有的工具在 Markdown 和 HTML 之间互相转换：例如 showdown 以及 turndown。

下面的代码是我基于别人博文，自己进行了一些改动，在 Blogger 的布局里添加一个 HTML/Javascript 的组件即可。在编辑 Markdown 博文时，需要切换到 HTML 模式，并且开头以 markdown 起头即可。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28


<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"></script>
<script>
var showdownOption = {
'simplifiedAutoLink': true,
'strikethrough': true,
'tables': true,
'tasklists': true
}
var converter = new showdown.Converter(showdownOption);
var posts = document.querySelectorAll(".post-body");
Array.prototype.forEach.call(posts, function (el, i) {
var idx = el.innerHTML.indexOf("markdown");
if (idx != -1 && idx <= 1) {
let md = el.innerHTML
.replace(/\n&amp;gt;/g, '\n>') // fix quotes
 .replace("markdown", ""); // remove flag

el.innerHTML = converter.makeHtml(md)
.replace(/&amp;amp;/g, "&amp;"); // remove redundant escape
 }
});
</script>

注意在使用的时候，所有 HTML 的内置标签的尖括号需要 escape 一下，比如 <> 分别需要用 lt 和 gt 来替代。上面的代码有个小问题，就是 showdown 会在 convert 的时候，将代码块中的 & 符号全部都 escape 了，这样一来网页中代码里的尖括号全部都无法显示。所以在代码的最后我将 escape 之后的 amp 又替换回原本的 & 符号了。这样一来唯一的缺点就是没法在 HTML 里显示，这就得等将来有时间再解决了。

如果尖括号不 escape 的话，像下面的 JS 代码会被执行:

1

<script>console.log("hello");</script>

可以借助在线的工具 HTML Escape 来自动进行转换。对于其它语言的代码，基本就不需要操心了。

除此之外，我还用 PrismJS 替换了原来使用的 highlightjs 来进行代码的高亮显示。我个人比较喜欢暗色的 tomorrow 主题，只需要加载 Prism 的 core js 文件以及使用 autoloader 自动加载对应代码区域指定语言的高亮方式。

1
2
3


<link href="https://cdn.jsdelivr.net/npm/prismjs@1.20.0/themes/prism-tomorrow.css" rel="stylesheet"></link>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.20.0/components/prism-core.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.20.0/plugins/autoloader/prism-autoloader.min.js"></script>

此外，还需要给滚动条加一下样式，否则在暗色主题下会很丑

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31


.post-body pre[class*="language-"] {
font-size: 14px;
line-height: 1.4;
background-color: #282c34;
border-radius: 6px;
overflow: auto;
}
/* Scroll */
pre::-webkit-scrollbar {
width: 10px;
height: 5px;
}
pre::-webkit-scrollbar-track {
background-color: transparent;
border-radius: 10px;
}
pre::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.4);
border-radius: 10px;
}
blockquote {
border-left: 4px solid #dddddd;
padding: 0 15px;
color: #777777;
text-align: left;
font-size: medium;
font-style: normal;
margin: 1rem 0rem;
}

显示效果：

这样就大功告成啦

参考：

Markdown + VuePress 构建个人主页

Sun, 19 Jan 2020 19:47:57 +0000

分享一下自己的个人主页模板，用 Markdown 轻松地编辑与生成个人主页。

项目初衷

很久之前就有打算做个人主页（Academic Portfolio/Online Resume）。感觉将来在学校申请、找工作等各方面都能够用上。
之前考虑过用纯 HTML 单页面静态文件来实现，但是这样 HTML 文件会变得非常长，之后增删信息也会变得麻烦。
大概在 2018 年 4 月，VuePress 出现了，起初它是用来管理项目文档的。它的好处之一是能够在 Markdown 文件中插入 Vue 的组件。可以利用这一点添加自定义的组件，然后用 VuePress 构建静态的网页文件。这是我目前个人觉得非常好的一套管理方式，并在 GitHub 上开源了我自己使用的模板 vuepress-homepage。之后可以在 GitHub Pages 或者 Netlify 实现免费的部署。

项目结构

整个项目的结构基本就是一个 VuePress 项目的结构，也是很经典的一个 Node 项目结构。所有的文档和配置都在 docs 文件夹中。在 .vuepress 文件夹里面，components 文件夹包含了我们自己实现的 Vue 组件，public 文件夹中是所有图片文件，style 文件夹下是一些独立的 CSS 样式，config.js 包含了 VuePress 的设置。
基本的使用可以参照项目中的每个文件，直接套用我的模板的话无非就是修改 Markdown 文件就行了。关于进一步的具体的使用及配置可以到 VuePress 官网查看其教程与配置说明，这里不再赘述。

项目部署

我个人的项目是用了 Netlify 进行部署。Netlify 部署起来非常简单，只要在它的网站上绑定一下 GitHub 的仓库，然后构建指令就是 yarn build，默认输出静态网站到 dist 文件夹。之后 Netlify 会自动 serve 这个文件夹中的静态网页。我们能够在 Netlify 中添加自定义子域名以及 Netlify 会自动添加 HTTPS 支持。

可以到 https://vuepress-homepage.netlify.com/ 查看部署好后的效果。

组件化的 Markdown

这里我具体解释对主页面 Markdown 文件的每部分我是如何设计和实现的。

以题图里的页面为例，About Me 以及 News 等部分都是直接 Markdown 输出的文字部分内容。因为整个页面比较简单，是比较自然的自上向下的结构，因此可以将最上面的部分视为一个可拔插的组件。
在 components 下用实现了 ProfileSection.vue 的组件，之后在 Markdown 文件里面就能够直接使用。对于名字、邮箱等参数的传递，我利用了 Markdown 的 frontmatter，本质上是 yaml，像简化版的 json。因为 VuePress 在解析 Markdown 时会有个全局的 frontmatter 变量，这样只需要将所有的参数放在 frontmatter 中，就能避免在正文组件里传递太多的参数。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


---
pageClass: home-page
# some data for the components

name: Harry Potter
profile: /profile.jpg

socials:
 - title: github
 icon: "/icons/github.svg"
 link: https://github.com/mtobeiyf
 - title: linkedin
 icon: "/icons/linkedin-mono.svg"
 link: https://www.linkedin.com
 - title: instagram
 icon: "/icons/instagram-mono.svg"
 link: https://www.instagram.com

cv: https://en.wikipedia.org/wiki/Harry_Potter
bio: Student at Hogwarts School
email: harry (at) hogwarts (dot) edu
---

<ProfileSection :frontmatter="$page.frontmatter" />

上面的 pageClass 可以给当前 Markdown 文件渲染后的元素添加类。这样可以当前 Markdown 文件最后面添加自定义的 CSS 来修改样式。
对于每个 Project 的项目，我也制作了一个自定义的组件。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


<ProjectCard image="/projects/1.png">
Harry P., Hermione G., *et al*
**The Making of Harry Potter's Wand**
Harry's wand was broken in 1997, but was repaired by him after the 1998 Battle of Hogwarts..
[[PDF](https://www.google.com)] [[arXiv](https://arxiv.org)]
</ProjectCard>

就能够渲染成下面的样式，其中包含在自定义组件之间的内容能够被捕捉，并在 .vue 组件中很方便的以 Slot 的形式去使用。

迁移博客平台到 Blogger

Sat, 18 Jan 2020 19:58:06 +0000

最近尝试将自己的博客搬到了 Google 的 Blogger 平台，这里记录了心路历程以及自己如何调整 Blogger 的。

前言

虽然静态博客简单免费，但是自从去年新浪图床开始对外链进行封禁，感觉我有很大一部分时间是花费在了维护博客上。所以兜兜转转一圈下来，还是想要回到类似 WordPress、Blogger 这样的 CMS 上，把重心转移到内容的记录。
静态博客让人比较难受的，是内容的管理。在大多数情况下想要发布文章需要用到脚本、NodeJS、Git 等工具链，而且插入图片需要稳定的图床服务。此外，想要在多个电脑切换编辑非常的不方便。
所以最近尝试了 Google 家免费的 Blogger 平台，并把之前的文章转到了这里面。为了和之前的平台有一致的阅读体验，作了如下的一些调整和功能添加。

代码高亮

用 highlightjs 可以让博客文章显示代码块的高亮。我个人之前更多是会选择 Prismjs，因为许多官方文档用到了它，比如 React, VuePress。
在 Blogger 中使用 highlightjs 也非常简单。Blogger 支持修改主题的 HTML 源码，添加一些自定义的样式和脚本自然不是问题。当然，还有更简单的方法。
选择 Sidebar 的 Layout，点击 Add a Gadget 按钮，选择 HTML/JavaScript。

之后按照 highlightjs 网站上所给的参考用法，添加如下的 HTML 代码将 highlightjs 引入。这里我个人选择了 dracula 配色的 CSS 样式。

1
2
3
4


<link rel="stylesheet"
href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.17.1/build/styles/dracula.min.css" />
<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.17.1/build/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

在文章的编辑页面，可以在 Compose 和 HTML 模式之间切换。

1
2
3
4
5
6
7


<pre><code class='language-cpp' lang='cpp'>#include <iostream>
int main()
{
std::cout << "Hello World!";
}
</code></pre>

显示为：

1
2
3
4
5
6


#include <iostream>

int main()
{
std::cout << "Hello World!";
}

像我一样嫌输 HTML 麻烦的可以在 Typora 中用 Markdown 写好代码块并注明语言后，选中后点击 Copy as HTML Code。

显示数学公式

同样，在上面我们添加的 HTML/JavaScript 的 Gadget 中可以添加额外的 JS 脚本来让 Blogger 支持显示 LaTeX 公式。这里我使用的是 MathJax，此外 KaTeX 也被经常用来渲染网页中的数学公式。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


<script>
MathJax = {
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']]
},
svg: {
fontCache: 'global'
}
};
</script>
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js">
</script>

效果：

样式微调

此外，Blogger 默认主题的一些元素的样式也不是很好看，比如 Blockquote 。好在可以在主题的 Customize 中添加自己的 CSS 来覆盖默认的样式。我添加了下面的 CSS 来让代码块部分和引用部分更好看一些。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28


code {
color: #476582;
padding: .25rem .25rem;
margin: 0;
font-size: .85em;
background-color: rgba(27,31,35,.05);
border-radius: 3px;
}
pre > code {
line-height: 1.4;
border-radius: 6px;
padding: 1.25rem 1.5rem;
}
code.hljs {
padding: 1.25rem 1.5rem;
}
blockquote {
border-left: 4px solid #dddddd;
padding: 0 15px;
color: #777777;
text-align: left;
font-size: medium;
font-style: normal;
margin: 1rem 0rem;
}

参考：github.css

写在后面

Blogger 可能也是暂时的选择，不过是目前比较好的选择。

优点：

免费，自带图床和基本的流量访问分析
主题可定制性高
爸爸是 Google，基本可以不用担心跑路的问题

缺点：

默认主题少，而且丑
自带的编辑器不是非常好用
被墙

我的 2018 年终盘点

Mon, 31 Dec 2018 23:53:40 +0000

本来想拖到明年跨年一起写，想想还是得赶紧写完。

“你迷失在地图上每一道短暂的光影”

故事不知道该从哪说起，2018 年似乎开始的有点慢热。再次翻开云相册，去照片中依稀找寻过去的美好光景。后半年的我像只“旅行青蛙”一样，到过许多的地方。其实我有许多故事，那么，你有酒吗？🍻

不想写成流水账，于是我把想到的一些整理成了问答，当作是回顾。

上半年都做了什么

感觉自己挺废柴的。课也不多，一直在咸鱼状态。白天学驾照，晒黑了两度。结束了本科最后一门考试。

今年都去过哪些城市

算上转机的话，国内有：武汉、上海、广州、北京；国外有：温哥华、基洛纳、多伦多、滑铁卢、雅典、罗马、梵蒂冈、巴黎、多哈。

印象最深刻的是哪里

其实挺纠结的，单纯谈印象的话我还是会选罗马，可能先入为主了吧。当时的行程只有一天，罗马的历史感、宗教和艺术，满足了我对欧洲所有的幻想，难怪叫作“永恒之城”。

为什么会去巴黎呢

“塞纳河畔，左岸的咖啡” 说到巴黎，记得高中的时候第一个笔友在巴黎，当时就特别想去法国，还在书店买了一个埃菲尔铁塔的钥匙扣。到了大学，也短暂的学过一段时间的法语，那个钥匙扣依然还在我的桌上。能去巴黎也算是圆梦吧。只不过时间过去了太久，物是人非，巴黎的笔友也早已没有联系，我也不如当年那般热血。

最大胆的事情是什么

背了一个包，一个人去欧洲。去了之后的想法竟是“活着回来”！欧洲其实并没有想象的美好，盗窃、诈骗、危险还是随时会有的。要多看一些攻略，规避自己被坑。当然我还挺幸运的，没有被偷抢，遇到了一些 nice 的人。

最巧合的事情是什么

在卢浮宫售票处朝两个亚洲面孔的打了个招呼，居然也都是武大的同学。那一刻感觉世界真小。 8 月在滑铁卢和国内导师重聚。一个多月前大家也都还在国内，如今却一同在地球的另一端。还有和同班同学在多伦多浪。回国之后，某天偶然在校园里碰见一个其它学校的同学（上次见面还是在多伦多）。

最激动的事情是什么

从基洛纳飞到了多伦多看泰勒的演唱会。第一天晚上买了黄牛票进场，激动 Cry。大概从 09 年左右开始听 Taylor 的歌，错过了她上海的两场演唱会。不过在多伦多圆梦了，还见到了好多国内外的 fans。

自己进步最快的地方

厨艺。在加拿大做了 3 个月的饭，以后一个人生活肯定不会饿死了。而且还掌握了一些拿手的菜，可惜回国没什么机会露一手了。

最惊险的事情是什么

在温哥华，托福 GRE 连考，中间只隔了 1 天。这还没完，考 GRE 的早上手机坏了。所幸带了电脑，摸到了考场。还有在雅典，扶梯前面一个小偷在掏前面人的包，在巴黎和一个撬车窗的小偷擦肩而过。

印象最深的剧集

《怪奇物语》的两季，充满了童真和想象，甚至买了 Eggo 来吃。《黑镜》的四季也是不错的，风格截然相反，对人性和社会的反思。

最牛逼的一件事

托福写作满分 30 分，哈哈哈哈，可以吹一年。

以后最想生活的城市

应该会选温哥华。气候、环境、生活方式比较适合...养老。当然目前更多的还是喜欢国内，生活便捷，更丰富一些。

旅行有什么感触

趁着年轻，有机会一定要多出去走走。我更希望最好能一个人独自去，能够按自己的节奏去自由的体验。一个好的手机/相机，是你旅行时的好伴侣，珍贵的回忆应当及时记录和收藏。不要对一个地方抱有过高的期望。在去罗马之前，本以为会和雅典差不多，结果超出了我的预期很多。

自己最大的改变

感觉自己心态更好了一些，日渐佛系。特别是在国内这样一个环境中，能更从容的去面对一些事情。因为见过了多种多样不同的人的职业和生活的选择，明白了生活的主动权大多是在自己手上的。当然，自己也要更努力，去追求理想的生活。

最想感谢的人有哪些

首先感谢父母吧，他们给了我足够的自由和支持，我才能够去追寻自己的梦想。还有老师们的指导，以及一些同学给予我生活和学习上的帮助。

最遗憾的事情

虽然实现了很多年前的一些梦想，但其实还有挺多小遗憾的，最大的遗憾应该是没能去成 MSRA。

2019都有什么期盼

拿到心仪的 offer，踏实的学习，努力提升自己。也不知道未来会何去何从，总之得做好准备，积极应对。希望关心过和帮助过我的人都能有更好的运气~ 2019 会更好！

2018 年 12 月 31 日北京

Node + Express + MongoDB 服务端开发小结

Sat, 22 Dec 2018 17:54:19 +0000

在刚过去的一次 Hackathon 里面，写了一个服务端的应用。不过由于时间关系，并没有写完 Orz。不过呢，也趁着这个机会学到了一些新的东西。下面就来具体介绍一下吧～

服务端技术栈的选择

服务端之所以选择 Node，显而易见，是因为 JavaScript 圈的生态。之前也有用过 Python+Flask/Django 写过后端，有些地方就不如 Node，比如异步、回调、箭头函数等。Express 相当于 Python 里面的 Flask，能够简化一些服务端的写法，比如初始化服务、路由等。之前在用 Node 做项目的时候，数据库我一直避开了，因为考虑到自己的项目对存取没有太大要求，只需要方便操作就行了。因此我用了 lowdb，一个基于 json 的本地数据库。你的数据库不大的话，那么用这样一个方式就可以了，而且读取 json 非常的便捷。此外还用过 SQLite，这是本地的 SQL 数据库，查询需要写 SQL。这次的项目里尝试了一下 MongoDB，一个非关系型数据库，基于对象和文档进行存储。

初始化Node及Express

首先我们 $npm init 一个空项目出来，添加 express 库 $yarn add express，新建一个 server.js，像下面一样添加几行代码，就能实现一个最基本的服务。访问 localhost:3000/ 就能看到 Hello World 的输出。

1
2
3
4
5
6


const express = require('express')
const app = express()
const port = 3000
app.get('/', (req, res) => res.send('Hello World!'))
app.listen(port, () => console.log(`Listening on port ${port}!`))

初始化数据库

首先我们需要在服务器或本地安装 MongoDB。我是在 Windows 平台上安装的，安装包体积大约有 500M，网上有很多教程，中间有一个步骤会问你是否需要安装 MongoDB Compass，建议可以安装一下，能够可视化的调试数据库。Windows 上的话需要手动去启动 MongoDB 的服务，服务默认的端口是 27017。在 Node 项目中，我们需要使用相关的库来对数据库进行操作，这里我用了 Mongoose。可以很优雅的连接 MongoDB 的数据库。我创建了一个 db.js 模块，将数据库作为一个 module。可以看到我连接的是 MongoDB 里面的 test 数据库。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


var mongoose = require("mongoose");
let DB_URL = "mongodb://localhost:27017/test";
mongoose.connect(
DB_URL,
{ useNewUrlParser: true }
);
mongoose.connection.on("connected", function() {
console.log("Mongoose connection open to " + DB_URL);
});
module.exports = mongoose;

项目结构

组件化是很有必要的，特别是当项目逐渐变得复杂的时候。于是我用了这样一个结构，将各个功能之间的耦合程度降低。routes 文件夹存放不同任务的路由，models 文件夹存放 MongoDB 中对象的定义，controllers 里面是对于不同类型数据的增删改查的操作。因此整个目录就像下面这样：

├── controllers
│ ├── taskController.js
│ └── userController.js
├── db.js
├── models
│ ├── task.js
│ └── user.js
├── package.json
├── routes
│ ├── task.js
│ └── user.js
├── server.js
└── yarn.lock

数据模型的构建

因为使用了 MongoDB，根据 Mongoose 提供的对象化的操作接口，需要将数据模型抽象出来。以 post.js 为例，我们将 post 抽象出来，创建一个 schema，告诉数据库一个 post 都有哪几个部分，每个部分对应的类型。这样的好处是在数据库设计时就能考虑到不同数据之间的关系，并将它们嵌起来，比如 post 中嵌入评论段。MongoDB 的好处就是像对象一样管理数据，减少查询的次数。但值得注意的是，如果关系更复杂的话（之后我就遇到了这个问题），嵌套数据反而很麻烦。否则就得像传统 SQL 设计数据表一样，但会造成很多的信息冗余。这个问题可能是后期还需要进一步探索的。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17


var mongoose = require("mongoose");
var Schema = mongoose.Schema;
let PostSchema = new Schema({
id: String,
title: String,
type: String,
author: String,
sendTime: Date,
tags: [String],
content: String
});
module.exports = {
schema: PostSchema,
model: mongoose.model("Post", PostSchema)
};

数据控制器的实现

对于不同的请求，我们需要根据请求的内容来对数据库进行存取，并返回对应的值。首先我们将数据库模型实例化，再根据后面路由调用的函数进行相应的操作。具体的查找筛选可以参考 mongoose 的文档。总之数据模型的层级不能太深，否则查找起来非常的难受，就会怀念 SQL。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


var GroupInstance = require("../models/group").model;
var TaskInstance = require("../models/task").model;
// Task index
exports.index = (req, res) => res.send("This is task index");
// List all users
exports.list_all = (req, res) => {
GroupInstance.find({}, (err, items) => res.json({ tasks: items }));
};

路由的实现

这个还是相对比较简单的。需要用到不容的控制器，并定义不同路由所触发的对应控制器的函数。再将其导出成模块供我们主服务使用。像 task.js：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


var express = require("express");
var router = express.Router();
var taskController = require("../controllers/taskController");
router.get("/", taskController.index);
router.get("/list-all", taskController.list_all);
router.post("/new", taskController.new);
module.exports = router;

模块的整合

到最后，我们就能将所有的模块整合在一起，此时我们的主文件 server.js 就应该如下。其中我们还使用了 body-parser 模块，来解析 post 请求时发送的数据。引入不同的 router，并定义他们的前缀，这样就可以通过这样的方式进行请求：localhost:3000/task/new

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20


const express = require("express");
const bodyParser = require("body-parser");
const app = express();
const port = 3000;
// Parser middleware
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
// Declare routers
var indexRouter = require("./routes/index");
var userRouter = require("./routes/user");
var taskRouter = require("./routes/task");
// Use different routers
app.use("/", indexRouter);
app.use("/user", userRouter);
app.use("/task", taskRouter);
app.listen(port, () => console.log(`Listening on port ${port}!`));

调试热重载

我们不可能每次都手动去启动我们的服务，我们可以使用 nodemon 模块来实现热重载，这样每次修改文件都能自动的启动服务。我们可以在 package.json 里面这样写：

1
2
3


"scripts": {
"dev": "nodemon server.js"
}

这样我们就可以用命令 yarn dev 来启动一个开发版本的服务了。

总结

以上就是我在短短 24 小时不到的时间里面学到的一些 Node 做后端的方法。当然，也遇到了很多的问题，特别是在数据库上。我认为在数据库的构建上需要多花点时间去考虑，MongoDB 有优势，也有一定的局限。Node 依靠 Javascript 的生态圈使其在网页开发上有了无可比拟的优势，在需要快速构建应用的场景，Node 不失为一个很好的选择。

2018 IEEE ICIP 会议见闻

Sat, 20 Oct 2018 19:50:17 +0000

非常幸运的参加了今年的 IEEE ICIP，在此我分享一下在这个国际会议上的所见所闻 🔥🔥🔥

前言

2018 IEEE International Conference on Image Processing（简称 ICIP 2018），是图像处理国际会议，10 月 7 号 ——10 号在希腊雅典举办。

在会议水平和规模上，自然不如 CVPR 和 ICCV。更不巧的是今年的 ECCV 正好在 ICIP 的前一个月，因此能来的大佬就少了。当然，这并不妨碍我这种弱鸡去学习一下，看看图像处理领域不同的论文和发展近况。

举办地

今年举办地在希腊的雅典。因为在欧洲，所以会议上有很多的都是来自欧洲学校的研究者。当然，这也并不妨碍中国学者们不远万里前来参会，因为雅典和圣托里尼岛也是不错的旅游目的地。

希腊在 2010 年爆发了经济危机，8 年过去了，希腊渐渐走出了经济衰败的阴影。走在雅典街头，或多或少还能看到一些混乱颓败的踪迹。在会议上，有国内来的老师和我们说有好几个人在 雅典被偷了钱，让我们与会的一些同学非常不安。雅典也算是一个旅游城市，在地铁上广场上餐厅中，都能见到各国的游客，当看见这些游客，会有些许的安心。

来到希腊，雅典卫城是一个必去的地方。公元前文明的残骸，在这里得以体现。特别是经过了欧洲动荡的中世纪，只有些许断垣得以残存，令人唏嘘。会让人不由的联想到英法联军火烧圆明园，文明的瑰宝被毁于一旦。

虽说举办地与学术本身并无关联，但 能够在科研之余领略不同国家的风土人情，也是国际会议的重要一部分。

会议议程

会议虽说是 4 天，但第一天基本可以忽略不记。7 号这天是 Tutorial 的环节，就是会议请了一些教授来进行长时间的授课，有不同的主题，应该是关于某一具体领域。当然，这些都是 额外付费的，贫穷的我并没有注册这些。在 Tutorial 完了之后下午 5 点是报道注册领取会议材料，以及一个欢迎晚宴。因为担心自己的人身安全，很多人 7 点中吃的差不多就离开了会场。

之后的三天就比较类似了。上午 9 点开始有一个一小时的专题 talk，之后外面进行 Poster 环节，上下午分别两场，不同的会议厅里举行不同专题 Oral 的报告。中间有茶歇，提供饼干等糕点，以及饮料。

其实整个会议的信息量还是挺大的，41 个 Lecture Session，86 个 Poster Session。外面有大概三四十张不同的 Poster，按类别分好区域，因此你可以挑选自己喜欢的主题去看。

会议厅里我就去的相对少一些，虽然 Oral 的论文质量可能会相对更高一点，但是因为讲整个 PPT 的时间也会很长，所以我还是选择在外面围观海报，会更有意思一些。

会议的论文已经在 IEEE Xplore 上有了，可以去检索相应的论文了。下面就挑选一些，我在整个会议里面看到的一些还算有意思的展示吧。

ICIP 内容节选

首先是 ICIP 2018 的统计数据，1753 的提交，839 的通过，最后的接收率将近 50%。

我们来看一下不同领域接收率的情况，可以看到 IVIU 的通过率最高 28%

这是第一天上午的 Talk，来自南加州大学的一个韩国人讲 CNN。其实讲的是自己的研究内容。不用反向传播，只用正向（类似滤波器设计）去设计卷积网络，当然只能设计一些很简单的了，他说好处是可以抵御对抗样本的攻击。反正我觉得有点扯。

之后就碰到了一个学校的了。遥感院的学长，做的还是图像拼接。这一块我不是很熟，但和学长聊了一下这一届的会议。后来中午一起去吃了东西。

非常热闹的第一天的 Poster Session

下午有 VQA 的 Session，我就围观了一下。这个是电子科大的一个老师提出的一种带权重且考虑到排序的相关系数。和常见的 SRCC 在一些特定情况下对衡量准确度进行了比较，而且因为有权重，因此可以自己设计符合特定任务的标准（比如正序最不好），如下面图中画出的曲线。具体想要拿来用还是得看论文。

下面是一个屏幕内容的评价。考虑到了 Edge，也就是边缘信息。并且魔改了一下 SSIM，把 Edge 信息加入，提升了一下屏幕内容质量评价的效果。

一个日本团队做的，很有意思的一个项目。简而言之，优化图片来提升商品的用户点击率。挺有商业前景的。像在淘宝上，一般我就是看图片好不好看决定点进去看商品详情与否。

下面这个是提取视频中文档边界。用的是数学形态学的方法。可能效率上会更好一些。当然，现在文档边界检测的应用很常见了，如微软的 Office Lens，扫描全能王等。

在 7 号上午认识的一个剑桥的博士，恰巧也是做质量评价方向的。

做图像增强的。让我想起了数字图像处理课让我们探究的均衡化的方法。

一个印度小哥的作品，讲真挺水的。我觉得和我数字图像处理课程设计有的一拼。其实就是根据文本去做图像选择与风格转换，可能之前没什么人做这个问题吧。

做一个课题的韩国小哥，英语表达能力太差，基本听不懂他讲的。好在前一天晚上看了一下论文。答题就是用 Pairwise 的方法去做这个任务，把分类问题变成比较问题。用了一个类似 Focal Loss 的损失函数。可以同时做 Ranking 以及 Classification 的任务。最后的指标也还可以。其实类似的点子之前我也有想到过，但是因为我太菜了，没实现出来 Orz

因特尔做的一个工作，用进化算法来自动调节 ISP 的参数。这个挺有意思的，让我想到了，很多时候不同品牌手机用的感光元件可能是同一个型号，但是拍出来照片的质量会有差别，原因就在于 ISP 的调教。

又看到了校徽。右边是做 SR 的。看标题是考虑到了区域的影响。

这个任务做的是水底视频中海洋生物的探测。这个 Paper 关注了数据增强的方法，用 GAN 来生成类似的图片。其实应该有类似的工作把 GAN 用到 Data Augmentation。其实我一直对把 GAN 生成的图片作为 Ground Truth 训练图片这个表示一些疑虑。

下面这个纯粹只是在中间的图中看到了熟悉的 U-Net、SPP、DeepLab，后两者在物体识别领域用到，前者是在 Conditional Generative Adversarial Network 里面用到了。U-Net 的 Shortpath 可能让其在图像生成上会有更好的表现。

隔壁华科的。做目标追踪的。

在景区门口认识的一个清华电子系小哥帮站的。就是考虑到旋转等变形，先把它变回去。

一个好看的法国小姐姐。Poster 也挺好看。用了 U-Net 和 Patch-GAN，提出了一个深度估计的 Loss，和一堆其它 Loss 比较。

上海交通大学，图像鉴黄。数据集是 Self-collected 的，哈哈。随后被媒体报道：《ICIP2018 | 图像鉴黄做得好，健康上网少烦恼》，很有意思了。

这个做的是车辆类型识别，而且据说已经在法国很多地方部署了。方法不难，就是用了 CNN，比较有借鉴意义的就是裁剪网络来解决过拟合的问题。

下面这个是用小波变换做识别的。他被问的最多的就是：“为什么不用 CNN？”，传统方法在 2018 年的会议上可以说是一股清流了。

这个课题很有意思，用照片做 PM2.5 的估计。虽然听起来有点扯淡，不过给不用专业仪器来快速估计 PM2.5 提供了一个新思路。

雨滴检测问题。用了滑动窗口去代替传统的 Region Proposal（因为雨滴形状色泽等多变），裁剪了 CNN。英国小哥的英式发音很有辨识度。

这个做的是对抗样本攻击。原理很简单，简而言之就是给图片打补丁来让 CNN 产生错误的分类结果。而这些干扰信息量很小。

一个年长的日本教授，激动的给我展示了视频去噪的效果。虽然 Poster 上全是公式，但他讲解的还是挺通俗的。用了 3D-DFT，因此算法会非常慢，主要是求解逆傅里叶很慢，不过效果还是很 OK 的。

来自挪威大学小哥，是个中国人。之前在 VQA 的相关 Session 经常看到他，一开始以为是日本人来着。最后我们的 Poster 在同一场。也算是缘分了。

这个意大利小哥，做的是有人脸图片的美学评估。方法和我的基本类似。更巧的是我们最后一天同一班飞机去了罗马。

我的展示

其实轮到我的时候已经是最后一天下午了，人并没有第一天的那么多。

Poster 做的略微小了一些，比例其实也不应该按 CVPR 的 2:1 来做的。被问到最多的一个问题就是我的 Local View 是怎么来的。反正在现场被各种人问了之后对自己的工作会有更深刻的理解。也会有很多人来提出潜在的改进的方法。

碰到几个教授问我是博士后还是博士，包括国内来的，他们都挺惊讶我是本科的。还有一个 Session Chair 说他的学生在做这个课题，但一直没有取得什么进展。忘记在 Poster 上留邮箱了。

印象最深的是一个 ARM 来的小姐姐，和我说应该趁机会看看他们胸牌上面的名字，然后去 LinkedIn 或者直接去 Social 一下，说不定对以后读 Grad 有帮助。其实会议本身就是一个 Social 的平台，我也有机会认识了很多人。

感想

通过参加这个会议，可以看到各种不同图像处理领域最新的进展和成果。你也可以比较容易的去理解一些新点子和方法，它们其实都是一些非常简单的一些小创意。我们可以尝试去借鉴这些点子，然后把它运用到自己今后的研究工作中去。

在这个 “人工智能” 一词盛行的今天，在 CNN 占领了半壁江山的图像处理会议，还是要向那些坚持使用传统图像处理 / 数学方法、忠于理论研究的研究工作者表示致敬。

会议很大部分人都是来社交的，同一个研究领域，不同国家的教授互相认识，汲取新的一些点子。作为学生也能够认识其它学校做同一个领域的同学并互相交流。这些就是会议最大的意义。

非常怀念会议茶歇的 希腊酸奶 + 果酱 + 蜂蜜。实在是好吃 😋

我的 GRE 备考 + TOEFL 复习建议

Tue, 25 Sep 2018 23:26:20 +0000

GRE 和 TOEFL 托福备考经验 + 一些自己的复习建议。文末附赠我整理的资料大礼包。

GRE

上周末考完了 GRE，特此总结一下。当然，在这也分享一下我觉得有用的资料。

首先来简单介绍一下 GRE 这个考试，GRE 全称是 Graduate Record Examinations，对于大多数专业录取需要的是 GRE General Test 的成绩。General Test，顾名思义，不会涉及和专业背景相关的任何知识。

GRE 一共分三个不同的部分：Analytical Writing（写作）、Verbal Reasoning（语文）、Quantitative Reasoning（数学）。写作部分需要写两篇，第一篇（Issue）是根据一个话题来写，第二篇（Argument）是去驳斥一个已有的论述，共计 1 个小时。Verbal 和 Quant 每个部分分别 30 和 35 分钟，但会以 VQVQA 或 QVQVQ 的顺序出现（其中有一个加试，不计入总分）。

词汇

我觉得 GRE 最重要的就是单词了，单词背不好后面Verbal有一半的题根本没有办法做。比较经典的是 GRE3000词（陈琦再要你命3000），涵盖了GRE常考的单词。网上经常有那种“21天突破GRE单词”这样的说法，我觉得 21 天很难去掌握 3000 个单词的。根据我的经验，3000 个词大约有 80%+ 都是生词，需要循序渐进的去背。相比较用纸质书籍，我更推荐用手机 APP 去背单词，这样可以利用步行、公交车、排队的时间去背。我用的是墨墨背单词，这是我用过所有里面记的最牢的一个背单词软件了，记忆曲线非常合理，而且没有广告，不过单词上限需要购买。我大概背了 40 天左右，每天打卡。前 3 周每天 150-200 词，考试前两周每天300+词。每天固定的学习量，如 200 词，包含了新词+复习词汇，这样不会有太大的复习压力。墨墨里面的助记部分有前人总结的 GRE 释义和记忆方法，非常有用。

此外还有新东方的佛脚词汇，2000 词左右，少部分单词再要你命 3000 没有涉及到。它的注释比较好，按 GRE 考点来注释，可以作为复习和回顾使用。

3000 词是一个方面，此外还有 Magoosh GRE Flashcards 的 APP，总共大概有 1000 词，有少部分 3000 词没有涵盖到，可以作为 3000 词的一个补充。

词典：GRE 考试的标准参考是韦氏词典（Merriam-Webster），有在线版的可以查，App 也可以免费用。不过是英-英释义，有少量广告。我用的是手机版欧路词典，可以导入第三方扩充词典，因此就可以使用和谐版的韦氏词典、朗文词典等。Mdict 格式的词典文件我会放在我的网盘里。

Verbal

在开始练习之前，务必背好 80% 的 3000 词

我非常推荐看Magoosh 的视频教程，把各种题型和方法讲解的非常透彻。国内比较经典的有陈琦（琦叔）的视频。看完这些视频之后，你可以对 Verbal 填空部分各个题型有所了解，掌握他们的基本套路。如果想看书的话，陈圣元的填空可以看一下，但是里面的题目相对比较老，不推荐做。

Verbal 部分比较注重的就是逻辑，你所选择的词都是要有理有据的，而不是你根据上下文臆测出来的，用 Magoosh 视频里面的说法是叫做Clue（线索），你需要在题干中找到线索，再根据句子结构判定是反义还是同义，最后得出选项。

Magoosh的题是非常好用的，就是订阅太贵了（150 美元 6 个月），如果几个人一起备考可以分享。

填空练习题

《陈琦GRE填空基础24套》 可以用来巩固 3000 词，题目也不是非常难。24 套做的感觉差不多之后，可以选择性的做一下《陈琦GRE填空强化36套》。我当时时间紧，所以只刷了基础 24 套的80%。接着可以开始做机经题了。

比较经典的机经题是 《GRE填空机经1000题难度分级版（第1版）》，俗称填空 1100，里面难度有分级。以我的感觉里面的 Hard 部分比真实考试是要略难一些的，而且有些出题思路有点怪。我大概到考前只做了 60%。

考试之前，推荐做一下官方150题，和真实的题目非常非常接近了。在被上面的题目虐过之后你再去做官方题会觉得非常的简单。

阅读练习题

经典的入门基础练习题就是 《陈虎平新GRE阅读36套》，俗称 36 套。相对来说比较简单，如果时间不是非常够的话可以跳过。

进阶的就是陈琦24套。此外比较好的还有陈琦200篇，相当于一个大型题库。机经的话有考满分200篇。

对于阅读部分的逻辑单题，也有陈虎平逻辑10套供你练习。

多说一句，阅读部分还是要多练习，我就是花了太多时间在填空部分导致 Verbal 的阅读部分的题目没有准备充分。

Quant

数学部分比较简单，基本只要读懂题目的话就很轻松了。有必要的话还是背一下数学部分的单词。然后做两套题就能上考场了。35 分钟的时间绰绰有余，一般都能拿 169-170。

AW

GRE 作文题都是有题库的，因此可以提前准备。

Issue 题干一般一两句话。注意问题的问法。发表自己的观点要有例子支撑。

Argument 一般是篇幅较长的论述。你需要找出 2-3 点来针对性的驳斥。要有理有据，论证要有逻辑。和高中的议论文差不多。

我提供的资料里面有作文的思路和相应的模板。

模考

官方一共有两套模考题 PowerPrep，俗称 PP2。适合在考试前一周做。现在是在线的网页版，可以直接到 GRE 官网注册账号选购（免费）。

这个据说是比较接近真实考试的成绩（？？？）。反正我两次做的时候都超困，第一套 V147（考试前3天），第二套 V143（前一天），考试 V153。

TOEFL

托福相对来说我复习的时间就比较少了。不过还是稍微提一下。

听力

托福听力部分我没什么特别的经验，还是多做模拟题。考满分上可以做听力题，掌握一下题型和出题套路就 OK 了。

阅读

在做过 GRE 的阅读之后，托福的阅读就相对比较简单了。不过还是要做几套题来掌握一下题型和做题的方法。

口语

口语的题型和主题比较固定，因此可以准备的很好。不能太依赖模板，还是要注重复述听力/文章内容以及发表自己的观点。

这个我有认真准备但是最后考爆了。考场发挥还是很重要的。推荐用考满分网页或 APP 去练习，可以听听别人怎么组织答案的。

作文

第一篇是读文章，听听力，然后写听力里面是怎么驳斥文章的。比较死板，可以准备模板，按部就班写就行。写 350+ 词。

第二篇和 GRE Issue 差不多，可以按 GRE 的套路写。观点不一定要有 3 个，但注意一定要有例子支撑你的观点。写450+词。

可以提前准备模板，字数宜多，但注意不要有太多语法错误。

资料下载

以上资料下载地址，提取码: vav3

其它参考

2018 微软 Build 大会第二日看点

Wed, 09 May 2018 12:40:17 +0000

第一天的微软 Build 大会主要聚焦于企业和云服务上，那么第二天的主题 Microsoft 365 就是和我们普通消费者和开发者密切关联了。下面一起来看看第二天都有哪些亮点。

前言

今年的 Build 大会于美国当地时间5月7日举行，一共有三天。第一天主要内容是 CEO 纳德拉讲云服务和企业服务，和我们关系不大，我就提前睡觉了。

第二天的内容关于 Windows，下面为你带来精彩亮点。

Spotlights

Microsoft 365

第一次听到 Microsoft 365 这个说法，其实就是：

Microsoft 365 = Windows + Office + EMS (Enterprise Mobility Suite)

手机时间轴

Timeline in Phone，把 Windows 的时间轴体验带到了移动端。这样就能随时随地管理你在 PC 上的工作。

如果是微软官方的应用的话，比如 Office、Outlook 之类，应该还能够支持直接在手机上进行处理。不仅如此，如果你有多台设备（笔记本、台式机等），使用同一个微软账户，就能在各个设备上同步你的时间轴。

你的手机应用

这个功能是用来解决这样一个场景：你在电脑上工作，突然手机来了消息，会打断你的工作。这时候为了不中断你的工作，在你登录了微软账户的手机上可以把通知信息（短信、应用等）直接推送到 PC 上，进而直接在 PC 上处理你的消息。

同时，它还能够直接管理你手机中的照片等内容。非常方便。

标签集 Sets

Sets 这个新的特性应该是整场的亮点了。

痛点问题：

“把一个项目中涉及到的网页内容和应用内容整合到一起非常难。”

“有时候我有几百个文件夹，我会搞不清有哪些东西在这些文件夹里面。”

“重新把我上次离开的工作所需要的材料再组织起来需要很长的时间。”

“如果我暂停做这件事一个礼拜，那之后我就会忘记这个组合。我觉得电脑是可以帮我记住它们的。”

解决方案

核心观念：把相关联的内容放在一起

Sets，用标签来管理不同的内容，就像你日常使用浏览器一样。比如，你在 Word/PDF 中打开一个外部链接，就可以直接在新标签页中显示出来。

当然，你可以把不同的应用组合起来，比如浏览器、PDF 阅读器、Word、PPT 等。应该能够支持大部分传统Win32应用。

在你关闭了一组标签之后，下次再打开其中的一个应用，会自动提醒你打开相关的页面、应用。因此你可以非常方便的恢复上次的工作。

当然，时间轴中是支持标签组的管理。你可以方便的追溯之前打开过的标签组。

UWP XAML Islands

简而言之，原本 UWP 才能够使用的一些界面控件，现在可以直接在 WPF 和 Win32 应用中使用了。

这样，有些就能够很容易集成进去：Edge 网页容器、手写笔迹区域等。

当然，是支持流畅设计的（Fluent Design）

Windows UI Library

这个应该是新的 UI 组件库。支持 Win10 周年更新及以上。

.NET Core 3.0

加快了桌面端 .NET 和 .NET Core 的统一步伐。

MSIX格式

为了解决应用分发、更新等问题，推出了一个新的统一的格式。用来统一 UWP 应用和传统 Win32 应用的打包。应该在不久就能看到这种格式的安装包了。

记事本支持Linux换行

延续几十年的 Bug，现在记事本终于支持Linux的 \n 换行了（Windows 默认 \r\n）

应用收入提升

对开发者的应用收入分成进行了调整，如果用户在应用商店里搜到了你的应用，那是 85% 的收益；如果是直接跳转到商店的，就是 95%。

（相比较原来的 70% 好很多了！

总结

以上就是主要内容了。总之 Windows 本身以及其对开发者的友好度是在不断提升的。 😸

Let's wait and see. ✌

Facebook 开发者大会精彩看点

Thu, 03 May 2018 20:30:38 +0000

之前并没有关注 Facebook 的开发者大会，但是今年的 F8 大会着实让人眼前一亮，特别是在人工智能领域。来看看都有哪些精彩之处~

前言

经历了前段时间的数据泄露时间风波后，Facebook 今年的 F8 开发者大会于 5 月 1 日在加州圣何塞 McEnery 会议中心开幕。

大会官网：https://www.f8.com/

大会视频链接：https://developers.facebook.com/videos

温馨提示：需要使用科学上网方能观看 😉

本周末也会有 Google IO 2018 和 Microsoft Build 2018，可以关注一下~

Day 1 产品

安全

在经历了之前的风波之后，Mark 一开始就强调了 FB 将会更加重视技术的正确使用。特别是在政治领域的更加严格的验证和筛选。对于广告也启用了工具使得他们更加透明。对于虚假新闻加大打击力度。

更加注重用户的隐私和数据。推出 “清除历史”（Clear History），这项新的隐私功能将可以让用户删除 Facebook 从某些网站和应用中收集的数据。

其实在国内，我们使用互联网就是在 “裸奔”。你的隐私其实在你不知不觉使用各种 App 的时候就被泄露了。只不过国内的大环境和监管比较好，所以风险相对来说小很多。

约会应用

一个非常有趣的应用，集成在 Facebook 之中。当然，它会更加注重隐私，对你的朋友是不可见的 😂。不然真的得尴尬了。当然，在介绍这个应用的时候还是强调了线下的相约，即找到感兴趣的活动，加入，认识新的人。

Instagram, WhatsApp, Messenger也有了小幅的更新。

VR/AR

F8 大会上宣布，Oculus 于今天上市。Oculus Go 正式登陆 23 个国家，它是 Oculus 的第一款 VR 一体机，支持 3 自由度头部追踪。售价 199 美元，比较良心。

Facebook 推出了一些新的方法，帮助用户在虚拟现实的世界里帮助用户更好的和好友和家人互动：聚会空间、玩桌面游戏、看电影电视、体育赛事等。还会自动把用户给卡通化，并在 VR 中支持面部表情。非常酷。

Day 2 AI & 研究

PyTorch 1.0

在 PyTorch 项目一年多以前启动以来，其社区、用户数量在不断增加。越来越多的学者使用 PyTorch 来实现或复现论文的成果。但其不足之处在于企业无法把模型应用到现成的产品之中，Tensorflow 在这一方面就更加成熟一些，这也是为什么众多企业会采用 Tensorflow 来部署模型到生产环境中。

那么 Facebook 自家使用的是 Caffe2 来部署，其天生的好处是用 C/C++，编译之后运行效率高。但推出之后在学术界一直不温不火。ONNX 是去年 Facebook, Amazon, Microsoft 共同推出的在不同深度学习框架之间互相转换模型的协议和工具。那么 PyTorch 1.0 就是结合了这三者，把研究 -> 部署这个过程变得更加容易。

为了支持这一特性，PyTorch 做了一个 JIT (Just-In-Time Compiler)，即时编译器。后端应该是和 Caffe2 结合起来了。具体的使用还得等到发布之后才能一探究竟。

更大型的数据集

这就是直接开挂了。用 Instagram 和 Facebook 上用户标注的照片来作为训练集，一共是 35 亿张图片。对，3.5 billion。不服不行。

然后 Facebook 用在 3.5 亿张图片上训练过的模型到 COCO 和 ImageNet 上做 Fine-tune，直接提升了 2 个百分点。

Detecion & DensePose

目标检测上肯定还是用的是 Kaiming He 的 Mask-RCNN 了。下图展示了这一问题近期的研究趋势。

不止如此，在检测人姿态的同时，还同时能够输出深度信息。下面是 DensePose，可以进行实时检测。

可以预想的是，以上的技术可以为未来的 AR 应用铺路，只需要 2D 摄像头和手机，就可以完成一些复杂的功能。而这一切，都是得益于 AI 技术。

开源地址

应该都会有 Pretrained 的模型的。可以在 https://facebook.ai/developers/tools找到这些发布的工具。

整个框架，包含了视觉 (Vision)、语言 (Language)、推理 (Reasoning) 三大前沿 AI 任务。

如果需要快速开发产品，直接拿 Facebook 的用就行了。真的强。

ELF 围棋 AI

Facebook 开源了其基于强化学习的围棋算法，来对标 Alpha Go。不同的是，这个模型只需要一块 GPU 就可以实时运行，强调了效率。

当然，Facebook 还开源了其它基于强化学习和推理的项目：House3D 和 TorchCraft （AI 玩星际争霸）

VR 应用

除了 3D 构建、手势识别，比较好玩的是这个卡通形象生成。这样在 VR 的世界里就会更加生动。

3D 全景重构建

不同于传统的方法，Facebook 提出利用双目摄像头拍摄全景图，自动计算出景深信息，最后合成出 3D 图像。对于 VR 应用中现实世界的构建非常有用。

总结

本次大会亮点挺多，从产品到研究，从社交、VR 再到 AI，Facebook 的布局也越来越明晰。

值得一提，Google IO 2018 将会在 5 月 8-10 号举行，Microsoft Build 2018 也会在 5 月 7 号开始。不妨关注一下，看看最新的行业应用及走向。

Cousera Deep Learning 课程学习心得

Mon, 02 Apr 2018 17:44:02 +0000

学习完Deep Learning的5项课程之后，记录一下课程的主要内容以及心得体会

前言

人工智能是现在最火的一个领域了，而深度学习与神经网络则是这一领域中运用最广泛的技术了。为了让更多人能够快速的入门人工智能，Andrew Ng，也就是吴恩达，在 17 年中辞去百度的职务后，迅速创办了 deeplearning.ai 以及推出了一个新的系列的课程，即 Coursera 上的 Deep Learning Specialization 专项课程。网易也和吴恩达联手推出了中文字幕版的学习课程。网络情况不好或者英语吃力的同学可以看网易的视频。

其实我是拖了很久，一直到寒假才有时间认真把这一门课程给刷完。虽然从 16 年底就开始接触了 CNN，这一次比较系统的课程给我的收获是非常大的。

最让我惊喜的就是这门课的作业材料。虽然要花费非常大的时间去完成，但是作业的代码质量非常高，容易上手。而且后期复习起来会更加方便。

下面的笔记其实是结合我个人情况总结的。我也推荐大家自己参与这门课的学习，而不是通过收藏/复制他人的笔记。亲自完成作业，会有更加深刻的理解。

按惯例，晒一波证书：

为什么要学习这门课

可能很多人都有这个疑问，现在网上关于 AI 的教程、讲座层出不穷，但质量确实良莠不齐。更多的则是一些商业公司打着 AI 的旗号来敛财的一种方式。当然，国外也有很多优质的入门教程。比如 fast.ai 课程则是和吴恩达课程的思路相反 —— 先不强调原理，而是通过代码来实现神经网络。这样的好处显而易见，初学者能够更有成就感。作为想要深入研究 AI 的同学，也应当深入理解神经网络和深度学习背后的一些原理。那么学习吴恩达的这门课就是不二之选。

预备知识

很显然，你要会基础的 Python 编程，以及良好的英文能力。还需要一些求导和矩阵运算的知识。

掌握一些 Python 基本工具的使用也是很有必要的，比如 Jupyter Notebook，Numpy 之类。

学习资源

这门课，已经有很多人写过总结了。

国内的话比较详细的就是黄海广老师的吴恩达深度学习笔记，目前已经更新了所有的课程。这个 “笔记”，更确切的说是课程的记录和翻译。比较详细，对你之后的复习回顾很有帮助。

GitHub 上也有很多人总结了，比如 DeepLearning.ai-Summary，也有单纯搬运了课程材料的（虽然不推荐大家这么做，因为违反了 Coursera 的荣誉准则）：https://github.com/JudasDie/deeplearning.ai

推特网友 Tess Ferrandez 做了一份非常漂亮的手绘笔记：notes-from-coursera-deep-learning-courses-by-andrew-ng，我猜这哥们一定是个学艺术的。

第一门课神经网络和深度学习

第一周深度学习引言

为什么使用深度学习

深度神经网络的模型对于大规模的数据有着更好的效果，这也是其优于传统的机器学习的方法最重要的特征。所以在有足够标注数据集的时候，使用深度学习的方法会比较合适。如果数据量不大，那么可能使用传统的机器学习算法如 SVM 就 OK 了。

第二周神经网络的编程基础

逻辑回归（Logistic Regression）

这门课从最基础的逻辑回归（Logistic Regression）开始 $\hat {y}=\sigma (w^Tx+b)$，其中 $x$ 是你的输入样本变量，$w^T$ 是权重参数，$b$ 是偏置值，$\sigma$ 是 sigmoid 函数 $\sigma (z)=\frac {1}{1+e^{-z}}$，用于模拟神经元的非线性，我们之后会称作 激活函数，是深度学习核心的元素之一。$\hat {y}$ 则为输出的预测。那么学习的过程则是调整它的两个参数 $w$ 和 $b$。

损失函数与梯度下降

为了衡量输出，我们需要定义 损失函数。对于上面的问题，通常使用 $$ L(\hat{y},y)=-ylog(\hat{y})-(1-y)log(1-\hat{y}) $$ 接下来需要做的就是使这个损失函数值尽可能小，以达到和标签值一样的值。

梯度下降法（Gradient Descent），使用来优化凸函数（convex function）的方法，那么更新参数的过程就可以用公式表述：$w:=w-\alpha \frac{\partial J(w,b)}{\partial w}$，其中我们通常称 $\alpha$ 为学习速率（Learning Rate），不能太大，也不能太小。玄学之一。【图】

计算图

计算图（Computation Graph），实际上并不复杂，就是把复杂的运算分解。如果你打算使用 TensorFlow，那么你必须要了解这个概念。比如 $d=a* b+c$ 这样一个非常简单的运算可以分解成一个乘法算子和加法算子。我们在计算 $d$ 的这个过程就是前向（Forward）计算，当我们需要做梯度下降优化的时候就需要做反向传播（Backpropagation），即从输出的值沿计算图反向计算偏导数更新节点参数。值得注意的是，并非所有的函数（算子）都有导数。整个深度学习的理论是基于在可微分计算上的。因此我们在自己设计损失函数或其它深度学习中的运算时一定要考虑可微的情况。【图】

向量化

向量化（Vectorization）和计算图一样，也是一个重要的概念。在深度学习的体系里面，我们一定需要有向量化的潜意识。通常我们在以前的编程中会使用 for 循环来完成一些计算，那么在 DL 中，我们需要尽可能把变量组成向量，因为向量在运算的时候可以加速运算，效率比单纯用两层 for 循环会快很多。当然，实现这样的转变其实很多时候不需要我们亲自去实现，Python 中的 numpy 库提供了足够丰富的处理矩阵向量的函数。

第三周浅层神经网络

浅层神经网络

现在我们知道了最基本的神经元的设计，就是上面的逻辑回归单元 $\hat {y}=\sigma (w^Tx+b)$。将多个这样的单元堆叠起来，就可以实现一个浅层的神经网络，通常指一两层的。再多一些就会称之为多层感知机，MLP（Multi-Layer Perception），或者直接叫做深度网络了（虽然现在看起来并不 “深”）。【图片】

激活函数

激活函数为神经元带来了非线性，这是区别传统的线性方式的地方。目前有很多常见的激活函数：sigmoid、ReLU、tanh、LeakyReLU。sigmoid 最古老，在传统一些的二分类问题会用到。ReLU 在现在的深度网络中会更常用到。它的函数表示也很简单 $relu (x)=max (0,x)$。你可能会问：这函数在 0 处不连续，怎么求它的微分？解决办法就是强行在 0 处定义了一个值 0 作为其导数。使用了 ReLU 之后，大型神经网络在训练上速度会更快。tanh 更多的用在了 RNN 之中。LeakyReLU 会在 GAN 中经常出现。更多奇形怪状的激活函数可以在 Activation Function 中找到。通常在反向传播的时候需要用到激活函数的导数，这里就不具体推导他们了。

随机初始化

在初始化神经网络参数的时候我们也需要注意。如果全部初始化为 0，那么梯度很有可能就会是 0，就会得到恒为零的输出。也不能初始化为同样的数、较大的数。要充分考虑到激活函数及梯度的影响，否则学习过程会很慢。通常让初始化的数服从一个分布。在后面学习中，会接触到 Xavier Initialization 和 He Initialization 的初始化方法，使学习过程更快收敛。

深层神经网络

深层网络

将我们的浅层神经网络多叠加几层，就可以得到一个更深的网络，也就是我们常称作的深度神经网络（DNN）。我们将输入和输出层中间的称为隐藏层（Hidden Layer）。其前向传播的过程（Forward Propagation），即计算过程，通常可以用下面的一般公式来表示：

Z[l] = W[l]A[l-1] + B[l]
A[l] = g[l](A[l])

其中 l 代表层，所以 A [l-1] 为上一层的输出，W [l] 为当前层的权重，B [l] 为偏置。g [l] 为当前层的激活函数，直至输出这一层的输出 A [l]。

我们需要会计算深度网络每一层参数的形状，和计算参数的数量。W 的形状（维度）是 (n [l],n [l-1])，b 是 (n [l],1)。他们的偏导数 dw 和 db 和他们的形状是一样的。对于 Z [l], A [l], dZ [l] 和 dA [l] 则是 (n [l],m)。m 是输入个数。

参数和超参数

参数（Parameters）是指神经网络学习（优化）过程中调整的那些参数，如 W 和 b。超参数（Hyperparameters）是指人为设定的一些参数，像学习速率、迭代次数、隐藏层个数 L、隐藏层单元个数 n、激活函数的选择等都属于超参数的范畴。深度学习的又一个玄学之处。有时候改变一个参数会有意想不到的效果。

第二门课改善深层神经网络：超参数调试、正则化以及优化

第一周深度学习的实用层面

数据集的拆分

在深度学习中，数据集的拆分是实验的第一步，也是比较重要的一步。因为往往数据集会影响整个网络的训练。在一开始的时候，我和很多人一样分不清训练（Training）、验证（Validation/Dev）和测试集（Test）。

训练集是给你的模型训练的数据集，也应该是数据量最多的一个。验证集是在训练中验证你模型泛化能力的集合。测试集则是测试你模型能力的数据集，和验证集有些许重合。那么通常来说，你的数据量在 100 到 100 万，通常按 60/20/20 划分，如果大于 100 万了，就 98/1/1 或 99.5/0.25/0.25。当然，这不是绝对的，而是表明在数据量足够大的时候，只需给验证集/测试集 1% 的数据量就足矣，测试集也可以不需要。你自需要保证你的模型见过训练集的数据和标签，没有见过验证/测试集的标签就行。还有很重要的就是你的数据集必须是 相似或同样的分布，如果你的训练集和验证/测试集差别太大，那么这样评估模型是没有什么意义的。就比如我在 MNIST 上训练了手写数字识别，用来检测生活场景下的数字，很明显是不合适的。对于更复杂的分类任务也是一样。【图】

过拟合与欠拟合

在我们训练神经网络的时候，通常会碰到一些情况（训练集/测试集误差）：过拟合（1%，11%）、欠拟合（15%，14%）、同时过拟合和欠拟合（15%，14%）、最好情况（0.5%，1%）

遇到这些问题，可以尝试不同解决方法。过拟合：更多的数据、正则化、更浅的网络；欠拟合：更深更复杂的网络、训练更长的时间、不同的优化函数。【图】

正则化

正则化是一种预防过拟合的方法，我们需要在损失里面加入正则项来作为惩罚，限制模型的学习能力。通常有 $L1$ 范数： $\Vert {W}\Vert {_1}=\sum\vert {W [i,j]}\vert$ ，以及 $L2$ 范数：$\Vert {W}\Vert {_2}=\sum\vert {W [i,j]}\vert {^2}$，可以通过 $W^TW$ 得到。对于简单的网络来说，以 $L2$ 正则化举例，其损失函数就会呈现下面的形式

$$ J(w,b) = \frac{1}{m}\sum(L(y(i),y'(i))) + \frac{\lambda}{2m} \sum \Vert{W[l]}\Vert ^2 $$

对应的，梯度下降权重更新的过程也会有一些差别。$L2$ 惩罚项通常被称为权重衰减（weight decay）。目前主流的深度学习框架都支持损失函数里加入 weight decay 的参数。具体正则化为什么能够降低过拟合就不在这里详细展开了。可以参考 Goodfellow 的《深度学习》。

Dropout

Dropout 是现在神经网络中经常使用的一种方法，通过随机屏蔽一些权重点来防止网络过拟合。在训练中将权重点随机屏蔽后，相当于你在训练一个更小的网络，那么经过多个训练批次（epoch）之后，你就相当于训练了多个子网络，近似 Bagging 集成，会使结果的鲁棒性更好，因为训练过程没有用到全部的参数点，间接降低了模型过拟合的可能。十分需要注意的是：Dropout 只用于训练，对于推断（Inference）的过程，我们需要把 Dropout 关掉。像 VGG 之类的网络就使用了 Dropout。【图】

其它方法

数据增强（Data Augmentation） 是常用的方法，特别是当你的训练样布不够多时，通过翻转、随机裁剪等方法可以得到近似但又不一样的数据用于训练。 预先停止（Early Stopping） 是指当你的模型在训练集和验证集上表现差异很大的时候，及时停止训练。模型集合（Model Ensembles） 通过训练多个模型，最后取平均预测输出的方法，通常能提升一些指标。但训练多个模型的代价就是花费的时间会很多。

归一化输入（Normalize Input）也是重要的一种方法，最简单的就是所有像素点的值除以255使所有像素点的值在 [0,1] 的区间中。在视觉任务中也会经常见到减去图像集的均值和除以方差，这样数据的均值和方差就为 0，这个过程能够让模型更快的拟合。

权重初始化

若选择了不合适的初始化参数，你很有可能会遇到 梯度消失/爆炸（Vanishing / Exploding gradients） 的问题。因此我们需要更合理的权重初始化方法。通常会选择 ReLU + 带方差的初始化。实际中比较常用的两种是 "He Initialization / Xavier Initialization"。

第二周优化算法

Mini-batch梯度下降

Mini-batch梯度下降，顾名思义就是将你的训练集划分成分一个一个的小批 mini-batch，因为一次性训练整个训练集在数据量极大的情况下是不现实的。通常 mini-batch 大小的设置会是 2 的次方，因此你会经常见到 32,64,128,256... 的 batch 大小，你需要确保你的一个 batch 能够被装的进 CPU/GPU 的内存。Batch-size 同样也是一个需要调整的超参数，也不是越大越好，因为可能会让你的 GPU 耗尽显存 orz。

下面分别是 Batch Gradient Descent (BGD), Stochastic Gradient Descent (SGD) 和 mini-Batch Gradient Descent (mini-BGD) 的伪代码。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


# Batch Gradient Descent (BGD)
for i in range (nb_epoches):
params_grad = evaluate_gradient(loss_function, data, params
params = params - learning_rate * params_grad
# Stochastic Gradient Descent (SGD)
for i in range(np_epochs):
np.random.shuffle(data)
for example in data:
params_grad = evaluate_gradient(loss_function, example, params)
params = params - learning_rate * params_grad
# mini-Batch Gradient Descent (mini-BGD)
for i in range(np_epochs):
np.random.shuffle(data)
for batch in get_batches(data, batch_size=50):
params_grad = evaluate_gradient(loss_function, batch, params)
params = params - learning_rate * params_grad

动量梯度下降

使用带有 momentum 的梯度下降可以加快学习过程，其核心思想是计算梯度的指数加权平均数，并利用该梯度更新

RMSprop

Root mean square prop

Adam

Adaptive momentum esitmation

学习速率衰减

Learning rate decay 也是常用的技巧。在一个数据集上训练的时候，一开始我们需要使用较大的学习速率来使 loss 较快下降一段时间。到后面想要继续提高准确率时再调小学习率。通常我们基于训练的次数（epoch）来调整学习率，一个常用的公式如下，你可以在任何 ImageNet 训练的代码中发现这个技巧，通常从 0.1 开始衰减。 $$ lr = \frac{\text{lr_0}}{1+\text{decay_rate}*\text{epoch_num}} $$

第三周调参、批归一化及框架

调参

参数调试，英文叫做tuning，是你在优化深度模型中一定会经历的一个过程。抛开模型内部的参数，有一些超参数是我们需要人为干预来设定的，例如：学习速率 Learning Rate、批大小 Mini-batch size、层数 Layers、隐藏单元个数 Hidden Units、优化函数的参数$\beta$、正则化系数等等。

批归一化

在现代神经网络中，一个重要的技巧就是 Batch Normalization，在一些框架中会把它称为 BN 层。思路非常简单，在上一层的输出后，先求小批的均值 $\mu_B=\frac{1}{m}\sum_{i=1}^{m} x_i$，接着求 mini-batch 的方差 $\sigma_B^2=\frac{1}{m}\sum_{i=1}^m{(x_i-\mu_B)^2}$，然后归一化 $\hat{x}_i=\frac{x_i-\mu_B}{\sqrt{\sigma_B^2+\epsilon}}$，最后得到输出 $y_i=\gamma\hat{x}_i+\beta$ BN 之所以能够起到效果是和之前归一化输入差不多，保证一层在输入改变之后输出不会受巨大的影响，也起到了一定正则化的作用。

提一下最近 Kaiming He 的团队又提出了组归一化（Group Normalization）：Wu, Yuxin, and Kaiming He. 2018. "Group Normalization". https://arxiv.org/abs/1803.08494.

Softmax 回归

在多分类问题的时候通常需要用到 Softmax，本质上是某一类的预测的概率分布。为了得到归一化的概率，首先以 e 为底数做乘方，保证输出大于 0，接着除以所有结果的和，得到归一化概率。 $$ P(y=j|z^{(i)})=\frac{e^{z^{(i)}}}{\sum_{j=0}^{k}e^{z_k^{(i)}}} $$ 在训练的时候，相应的损失函数：$L(y,\hat{y})=-\sum{y_i log\hat{y}_i}$，就是一个负的对数和 log_sum

框架

为了更方便的实现深度学习的算法，目前有许多深度学习的框架：TensorFlow、PyTorch、Caffe/Caffe2、Keras、MXNet 等。不能说是三足鼎立，但也是五花八门层出不穷。Keras 最适合初学者上手，它的 API 非常友好；TensorFlow 一家独大，但对初学者不是很友好，而且 API 非常复杂；PyTorch 更灵活，介于 Keras 和 TensorFlow 之间；Caffe 安装十分麻烦，不过使用起来还是不错的；MXNet 的 Gluon 像是 Keras，提供了非常友好的 API。还有其它的框架如 Darknet，YOLO 就是基于此，以及百度的 PaddlePaddle 等等。Facebook 最新为物体检测推出的框架 Detectron，Mask-RCNN 就基于此开源。

这门课里主要讲解了 TensorFlow，我认为比较重要的概念是张量（Tensor）、静态图（Graph）和 Session。这里不详细展开。

框架只不过是工具，能够熟练的掌握一个工具就可以了。在研究领域真正的还是需要快速的实现自己的想法并进行验证和迭代。

第三门课结构化机器学习工程

TODO

第四门课卷积神经网络

第一周卷积神经网络基础

边缘检测

卷积网络，顾名思义，就是以卷积运算为基础的架构。

卷积在信号处理中是用来滤波的，在离散序列中 $s(t)=(x*w)(t)=\sum_{a=-\infty}^{\infty} x(a)w(t-a)$，然而在机器学习的任务里，通常我们需要处理的是多维的张量/矩阵，对于图像处理，在二维空间中同样能够定义卷积的运算。CS231n 的课程上有一个 Demo 演示了这个卷积的过程。通常，在 CNN 中，并不会把卷积核做翻转的处理。我想本质上是因为卷积核通常是对称的，因此对运算结果没有实质上的影响。

在图像处理的课程中，一个重要的运算就是边缘提取（Edge Detection），通常使用 Sobel 算子或 Canny 算子。通常大部分课程会以边缘检测为例，用来说明卷积神经网络中的卷积运算主要提取了输入图像的边缘信息。下面是一个 x 方向的 Sobel 算子。

$$ G_x= \begin{bmatrix} +1 & 0 & -1 \\ +2 & 0 & -2 \\ +1 & 0 & -1 \end{bmatrix} $$

在 CNN 中，我们把这种矩阵称为核（Kernel），这其中的参数并非我们手动设置的，而是需要通过优化来得到的。

多维卷积运算

大小为 $(n,n)$ 的矩阵，与大小为 $(f,f)$ 的核进行卷积运算后，不难得到大小变成了 $(n-f+1, n-f+1)$

Padding（填充）和 Stride（步长）也是常用的参数。Padding 的作用是在原始图像周围填充（通常是 0），这样在卷积完之后就可以得到大小和原始输入一样的结果，否则在进行了几次卷积之后，输出形状太小而包含不了有用的信息。在加上 $p$ 单位的 padding 之后，大小变成了 $(n+2p-f+1, n+2p-f+1)$。而 Stride 调整的是步长，即每次卷积核行进的距离。那么输出的形状就变成了 $(\frac{n+2p-f}{s}+1, \frac{n+2p-f}{s}+1)$，对于可能出现的小数情况，向下取整就行了。

对于图像，通常是三维的，输入 6x6x3 与 1 个 3x3x3 核运算可以得到 4x4x1。更多的时候，可能我们会用 10 个 3x3x3 卷积核来拓展输出的维数，就会得到 4x4x10 的输出。现在，我们就可以计算论文中的卷积层的输出和对应的参数的个数了。

卷积层

现在来举个卷积层的例子，输入大小为 6x6x3，经过 10 个 3x3x3 的核得到 4x4x10 输出，加上 10x1 的偏置 bias 和 RELU 激活函数，最终得到 4x4x10 的输出。参数数量为 (3x3x3x10) + 10 = 280

池化层

Pooling（池化） 层通常是来对前一层卷积后的结果进行降维操作的。通常有 Max Pooling 和 Average Pooling，前者用的多一些。Pooling 层是不含有可优化的参数的，因此有时候 Conv 和 Pool 会合并起来算一层。

全连接层

Fully connected（全连接） 通常用在最后降维及输出预测的结果，也是参数最多的一层。比如前一层的输出是 5x5x16，我需要 5x5x16x120 的矩阵和它卷积得到 1x1x120 的输出，即 (120,1)，实现了全连接层。这样它的参数（算上 bias）就有 5x5x16x120+1=48,001，是非常大的一个值了。

若后面再跟一个全连接 (84,1)，则需要一个 (84,120) 的矩阵 W 和 (84,1) 的偏置 b，这样参数就有 84x120+1=10081 个。

因此在很多现代的网络中会避免使用全连接，比如 ResNet、GoogLeNet，采用 GAP (Global Average Pooling) 代替全连接层来降维。

第二周深度卷积网络：实例探究

经典网络

LeNet-5, AlexNet, VGG 是比较有代表性的经典的卷积网络。

LeNet-5: Conv ==> Pool ==> Conv ==> Pool ==> FC ==> FC ==> softmax

AlexNet: Conv => Max-pool => Conv => Max-pool => Conv => Conv => Conv => Max-pool ==> Flatten ==> FC ==> FC ==> Softmax

VGG: 和AlexNet 相似，采用了更大的 filter 以及更深的网络层数。https://arxiv.org/abs/1409.1556

具体的可以参考 CS231n 的 case 以及它的 Lecture9 的 slide。

残差网络

核心思想：利用 shortcut/skip connection 结构来增加网络深度。在有了 skip connection 之后，最坏的情况是当前层没有学习到任何的有用参数，输出为 0 的话，后一层信息就直接等于了前一层。这样即使增加网络层数，也不见得会影响性能。

不过这种解释听上去很有道理，但还是挺玄学的。

Inception

Inception 是一个简洁高效的网络模型。不同于残差网络，其主要组成是称作 Inception Module。

Network in Network：顾名思义，网络中的网络，核心思想是用 1x1 的卷积

[未完待续]

快速部署你的深度学习模型为网页应用

Thu, 15 Mar 2018 23:04:13 +0000

训练好了深度学习模型，该怎么给妹子展示？本文带你用 Keras 和 Flask 搭建一个简单易用的深度学习图像网页应用

前言

小明参加炼丹不久，自我感觉训练了一个非常牛逼的深度学习模型——神奇动物分类器，于是发了个朋友圈。一条优美的交叉熵损失曲线，是每个炼丹民工的梦想。

一个好朋友妹子看到之后说：“好厉害啊，能不能让我试一下”，小明当然选择同意啦。不过这下可难住小明了，总不能麻烦她配置一个深度学习环境吧，那么怎样让她体验到我的模型的厉害呢？

为了解决小明的烦恼，帮助像他一样的同志更好的展示装逼，同时弥补现有开源项目丑陋的 UI 的缺点。这个小小项目就诞生了。

具体步骤

keras-flask-deploy-webapp，不要 1 小时！不要 1 小时！真的只要 10 分钟！

我们来看看搭建这样一个网页应用都需要哪些步骤：

下载
运行

“你这样是找不到女朋友的”

好，我详细一点！

下载代码

用你最心爱的命令行 / 终端来克隆一下我仓库的代码

1

$ git clone https://github.com/mtobeiyf/keras-flask-deploy-webapp.git

安装必要模块

Python 肯定得先装好吧，推荐 Python3。可以参考我之前的文章 Win 下 Python 开发环境配置 & Tips 分享

1

$ pip install -r requirements.txt

喂，说好的十分钟呢？ ——“你网速慢怪我咯？？！”

运行

1

$ python app.py

这时候用浏览器打开 http://localhost:5000/

我们来测试一下，给它一张熊猫图片

哎哟，不错哦

如何魔改

上面是用 Keras 训练好的 ResNet50 的样例，还有更多的预训练好的网络在 Keras 应用，像 DenseNet, MobilNet, NASNet 等等

那么我们在用自己的模型的时候要怎么办呢？看一下这段代码

界面太丑，我想要萝莉风格！没问题，页面标题之类的信息去改 index.html，样式去找 main.css 就行啦

部署

即使这样，还是没法让朋友圈里面所有的人都体验到。

这时候，你需要一台服务器

记得去这里看如何配置哦~ keras-flask-deploy-webapp，这里不详细说了。

配置好了之后，其它人可以在手机上尽情的调戏你的模型了

大家玩的愉快！

别忘了去 star 一下~ https://github.com/mtobeiyf/keras-flask-deploy-webapp

命令行数据科学工具笔记

Tue, 30 Jan 2018 00:48:48 +0000

《Data Science at the Command Line》阅读笔记。用命令行工具来提升效率，还有这种操作.jpg

前言

对于习惯了 Windows 图形化操作界面的人来说，对于命令行 / 终端操作界面可能嗤之以鼻。但不可否认的是使用命令行的效率是大于图形界面的。无意间看到了这本书，觉得里面的一些命令行操作非常实用，也是之前没有接触过的。故记录书中的一些通用的技巧，在很多 Linux 下面都是同样适用的。对于涉及到具体的问题，可以诸如 Python 解决的，就跳过了。这些命令不必烂熟于行，但至少

本书在线阅读的网站是 https://www.datascienceatthecommandline.com/ 示例和 GitHub 地址是 https://github.com/jeroenjanssens/data-science-at-the-command-line

入门起步

首先你需要一定的 GNU/Linux 知识，至少会使用 Linux 系统。那么命令行工具的环境大致可以分为四层：命令(Command Line)->终端(Terminal)->Shell->操作系统(Operating System)。Shell 是解释你输入命令的，一般我们在 Linux 发行版中使用的 Shell 是 bash，当然也有其它的比如大名鼎鼎的 zsh。

如何执行命令行工具呢？在终端下输入相应的命令就行了，比如 $ pwd 就会给出当前的地址。

常见的命令行工具可以分成 5 种：

二进制可执行文件，一般是由其它编译而成的
Shell 自带命令，比如 cd 和 help
可解释脚本，如 Python 脚本
Shell 函数，Shell 是自带了一些函数的如 seq、fac
命令别名 (alias)，你可以把一些很长的命令用别名的方式来简化。

结合使用不同的命令行工具，比如

1

$ seq 100 | grep 3 | wc -l

seq 100 的作用是输出 1-100 的数，那么 grep 就在输出中找出含有 3 的项，之后 wc -l 就是数 grep 之后输出的行数，那么这里有 19 个。

重定向输入输出，如 $ seq 10 > output.txt 就可以把命令行的输出保存到文件中，这在许多调试中是非常有用的。下面的命令中，echo的 -n 是不换行，>> 是指在文件后接着写 (append 的方式)

1
2


$ echo -n "Hello" > hello-world.txt
$ echo " World" >> hello-world.txt

接下来看看怎么读取文件，一个常用的命令是 cat，如 $ cat hello-world.txt | wc -w，其中 -w 参数是数单词数 (words)，这条的结果应该是 2，因为 "Hello World" 有两个单词。当然还有其它的方法，这句和上面的输出是一样的 $ < hello-world.txt wc -w，只不过它将 hello-word.txt 文件直接加载到了 wc 的输入流里面。或者直接使用 wc 的参数 $ wc -w hello-world.txt，但此时输出会将文件名附在单词数后面。

和文件打交道，常用的命令是移动/剪切 mv，复制 cp，删除 rm。下面整理了最常用的一些命令。 $ mv hello.txt ~/book/ch02/data/ 将文件移动到文件夹中； $ cd data 切换目录，$ mv hello.txt bye.txt 重命名； $ rm bye.txt 删除文件，$ rm -r book/ch02/data/old 删除文件夹； $ cp server.log server.log.bak 复制文件，$ mkdir logs 新建文件夹

在命令行中寻求帮助，对于每个命令行工具，一般是有相应的说明文档的，比如 man cat 就可以查看 cat 工具的说明。下面列举了常见的三种查看帮助文档的方式。 $ man cat | head -n 20 使用 man 命令查看帮助前 20 行； $ help cd | head -n 20 对于一些工具使用 help 也是一样的。 $ jq --help 大部分工具都有 --help 这个参数，也一样可以查看帮助

Bash 常用快捷键，熟悉了的话能够提高不少效率。

获取数据

解压

在 Linux 中，我们最常见到的压缩文件后缀名是 .tar.gz、.zip 和 .rar 文件，对应的解压缩命令是 tar、unzip 和unrar，注意在使用他们之前要确保已经正确安装了这些工具。比如，$ tar -xzvf data/logs.tar.gz，注意命令的参数是-xzvf，分别对应解压 archive、gzip 解压、verbose 输出、指定 file。书中提供了实用的 Bash 脚本来解压不同类型的文件，附上地址。

转换 Excel 文件

很多情况下，使用 Excel 保存的数据文件会存放在一个 xlsx 文件中，对于命令行工具来说非常不友好，通用一点的数据格式是 CSV 格式。这时候 in2csv 命令就能派上用场了。需要先安装一下 sudo pip install csvkit。之后就可以使用命令 $ in2csv data/imdb-250.xlsx > data/imdb-250.csv 将xlsx文件转换成csv文件了。使用 $ in2csv imdb-250.xlsx | head | cut -c1-80 可以查看，但是输出的是原始的逗号分隔文件，非常不友好。为了使显示效果更好，可以使用 csvlook 的管道。如 in2csv data/imdb-250.xlsx | head | csvcut -c Title,Year,Rating | csvlook 的效果会好很多。另一种处理的方式就是使用 Libre Office 这样的的软件打开，再进行转换。但这样非常不方便，而且你在用服务器的时候使不可能装一个 Office 套件的。

查询关系数据库

关系型数据库常见的有 MySQL、PostgreSQL 和 SQLite 等。使用命令行工具 sql2csv 可以更方便的使用 CSV 处理 SQL 数据库。如使用 $ sql2csv --db 'sqlite:///data/iris.db' --query 'SELECT * FROM iris '\> 'WHERE sepal_length > 7.5' 进行 query 查询操作。

从网上下载数据

使用最多的是 cURL 工具。 $ curl -s http://www.gutenberg.org/cache/epub/76/pg76.txt | head -n 10，参数 -s 表示 silent 模式。 $ curl http://www.gutenberg.org/cache/epub/76/pg76.txt > data/finn.txt 将 curl 下载的内容到文件中，此时不能用 -s 模式。 $ curl -s http://www.gutenberg.org/cache/epub/76/pg76.txt -o data/finn.txt 使用 -o 参数指定输出文件，此时可以使用 -s。 $ curl -u username:password ftp://host/file 下载 FTP 上的文件 $ curl -L j.mp/locatbbar 当网址是诸如 http://bit.ly/* 的自动跳转等短网址时，加上 -L 参数就可以下载跳转之后的网页内容。

通过API请求数据

很多时候我们需要通过一些在线服务提供的 API 来获取数据。比如我们需要知道某地的天气时，就需要通过一些天气服务提供商提供的网络接口来获取数据，通常返回的数据格式时 json 形式的。使用最基础的 curl 就能实现，如$ curl -s http://api.randomuser.me | jq '.' 当我们需要更高级的操作时则需要其它工具，这在后续会涉及到。

创建可复用的命令行工具

其实就是将命令写进一个脚本文件。这在我们需要重复连续执行繁琐的命令的时候会非常有用。当然这里只能介绍一些基本的脚本编写，更复杂的需要阅读 Shell 脚本编写的相关书籍。

将单行指令转换为Shell脚本

通常要经历下面几个步骤：

将单行指令复制粘贴到一个文件中
给文件添加执行权限
定义一个 shebang 行(如 #!/bin/sh)
去除固定输入部分
添加参数
可选的拓展你的路径

复制单行命令到文件

有一个技巧是可以通过 !! 来代替上一条执行了的命令。一般来说我们会将 Bash 脚本命令放到 .sh 文件中，表明是 shell 脚本。我们就可以通过 $ bash book/ch04/top-words-1.sh 这样的命令来执行 Shell 脚本了。

添加权限

绝大多数情况下，我们使用 vim 或者 nano 编辑器创建的 .sh 文件是没法直接执行的。因为我们还需要给它赋予可执行权限。那么这时候就要用到更改权限的命令 chmod。在终端中执行 $ chmod u+x top-words-2.sh，其中 u 指定是用户（也就是你），+x 代表增加执行权限。这样你就可以在终端中直接执行 ./top-words-2.sh 来运行这个脚本了。通过 $ ls -l top-words-2.sh 来查看文件具体信息，我们可以看到权限部分由原来的 -rw-rw-r-- 变到了 -rwxrw-r--，增加了 x，执行权限。

定义 shebang

在 bash 脚本的第一行，我们需要加入 #!/usr/bin/env bash 来告诉终端是用bash来执行这个脚本。如果你添加的是 #!/usr/bin/python，那么就是用 Python 来执行。

去除固定输入

把 bash 脚本中的固定输入部分删除，这样我们就可以通过终端把我们需要的输入直接给脚本，而无须每次都改动脚本。 $ cat data/finn.txt | top-words-4.sh，通过管道把数据给 shell 脚本。

参数化

下面的脚本内容定义了一个变量 NUM_WORDS，在使用这个变量的时候需要在前面加$符号，这个变量的内容是 $1 代表着脚本第一个输入参数，比如 ./xx.sh 1 里的 1。

1
2
3
4


#!/usr/bin/env bash
NUM_WORDS="$1"
tr '[:upper:]' '[:lower:]' | grep -oE '\w+' | sort |
uniq -c | sort -nr | head -n $NUM_WORDS

拓展你的 PATH

很多情况下，在不同的文件夹中，你也想使用你之前编写好的脚本，这时候把脚本所在路径添加到系统PATH中就能够使你在任何地方访问到。 $ echo $PATH | fold 想要长期的改变系统的环境变量的话，就需要修改 .bashrc 或 .profile 文件了。

使用 Python 创建命令行工具

迁移脚本

上面的脚本，可以同样使用Python来实现，下面代码给出了实现。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


#!/usr/bin/env python
import re
import sys
from collections import Counter
num_words = int(sys.argv[1])
text = sys.stdin.read().lower()
words = re.split('\W+', text)
cnt = Counter(words)
for word, count in cnt.most_common(num_words):
print "%7d %s" % (count, word)

这时候我们就可以通过 Python 脚本来执行我们所需的功能，将数据流输入到脚本并附上参数 5。$ < data/76.txt top-words.py 5

使用标准输入来处理流数据

当输入数据流是类似命令行形式而非文件时，你就不可能一次性全部处理掉，故需要一行一行处理。

1
2
3
4
5
6
7
8


#!/usr/bin/env python
from sys import stdin, stdout
while True:
line = stdin.readline()
if not line:
break
stdout.write("%d\n" % int(line)**2)
stdout.flush()

清洗数据

对普通文本操作

过滤行

主要用到的命令行工具是 sed 和 awk

基于位置：生成一个 10 行的数据用于演示。$ seq -f "Line %g" 10 | tee data/lines 打印前三行：$ < lines head -n 3;$ < lines sed -n '1,3p'；$ < lines awk 'NR<=3' 打印末三行：$ < lines tail -n 3 删除前三行：$ < lines tail -n +4；$ < lines sed '1,3d'；$ < lines sed -n '1,3!p' 删除末三行：$ < lines head -n -3 打印 4-6 行：$ < lines sed -n '4,6p'；$ < lines awk '(NR>=4)&&(NR<=6)'；$ < lines head -n 6 | tail -n 3 打印奇数行：$ < lines sed -n '1~2p'；$ < lines awk 'NR%2' 打印偶数行：$ < lines sed -n '0~2p'；$ < lines awk '(NR+1)%2'

基于模式：使用 grep 和正则表达式 $ grep -E '^CHAPTER (.*)\. The' alice.txt，在 alice.txt 中找出所有以 "The" 开头的章节

基于随机：使用 sample 工具创建数据集的子集 $ seq 1000 | sample -r 1% | jq -c '{line: .}' 可以指定 sample 的延时，避免数据一下子太快打印出来而产生错误，这在调试你的脚本时非常有用。 $ seq 10000 | sample -r 1% -d 1000 -s 5 | jq -c '{line: .}'

提取值

使用 grep 的输出到 cut 工具中 $ grep -i chapter alice.txt | cut -d' ' -f3-

替换与删除

使用 tr 工具 $ echo 'hello world!' | tr ' ' '_'，把空格替换成了下划线 $ echo 'hello world!' | tr -d -c '[a-z]'，删除不是 a-z 的字符 tr 也可以用来转换大小写 $ echo 'hello world!' | tr '[a-z]' '[A-Z]'，将小写转换成大写 $ echo 'hello world!' | tr '[:lower:]' '[:upper:]'，与上面效果相同

操作 CSV

使用了三种工具：body、header 和 cols

操作 HTML 和 JSON

使用了curl、scrape、xml2json、jq、json2csv

管理你的数据工作流

原书使用了 Drake 工具。因为不太通用，故跳过。

探索数据

用了 R 语言中大名鼎鼎的 ggplot2 来进行数据可视化。在 Python 中可以使用 matplotlib 或 plotly 等可视化工具。

并行管道

普通循环

这个还是挺有用的。使用 bc 来计算数学表达式。$ echo "4^2" | bc

1
2
3
4


$ for i in {0..100..2}
> do
> echo "$i^2" | bc
> done | tail

逐行循环：

1
2
3
4


$ while read line
> do
> echo "Sending invitation to ${line}."
> done < data/emails.txt

也可以从标准输入流（即你的控制台输入）中获取数据 $ while read i; do echo "You typed: $i."; done < /dev/stdin

逐个文件循环：

1
2
3
4


$ for filename in *.csv
> do
> echo "Processing ${filename}."
> done

还可以使用 find 来更灵活的寻找文件 $ find data -name '*.csv' -exec echo "Processing {}" \;

GNU Parallel

非常好用的一个工具，可以让循环变得简单，并且易于管理。 $ seq 5 | parallel "echo {}^2 | bc"

对数据建模

降维、聚类、回归、分类，机器学习问题。这里不展开了。可以利用 python 等更友好的实现这些。

Win 下 Python 开发环境配置 & Tips 分享

Mon, 29 Jan 2018 01:57:49 +0000

多年的 PY 经验来告诉你如何在 Windows 下愉快的使用 Python 进行交易。包括但不限于 Python 安装选择、开发环境配置、模块和包管理、学习资源、使用 Linux 子系统中的 Python 等。

前言

随着改革开放和进入二十一世纪，我国已迈入社会主义新时代。（画风突变）近几年来，Python 已经逐渐发展成为最为流行的程序设计语言之一，不仅仅是因为它入门简单，更重要的是它在各种场合的灵活性和可拓展性。目前为止，它的应用领域已经覆盖了 Web、数据科学、人工智能、传统软件等等。对于大多数有 C 语言或者其它语言编程基础的同学，或者即使你没有任何编程基础，配置好合适的开发环境是入门 Python 的第一步。其实配置 Python 开发环境是非常简单，下面给出一些个人的建议。

Python 环境选择

版本选择

可能你遇到的第一个问题就是如何选择 Python 的版本，用 2 还是 3。这其中有很多历史遗留的问题在里面。当然，2018 年了，Python2 要慢慢被淘汰了，所以优先推荐 Python3.x 版本。而且两者的语法几乎没有什么差别，而且已经有人为你考虑好了《在 Python2.7 即将停止支持时，我们为你准备了一份 3.x 迁移指南》（原文 Github) 当然，在 Linux 系统中，尤其是服务器，通常默认安装了 Python2.x 版本，而且两个 Python 版本共存会带来一些问题，因此传统的方式可能更受欢迎。

选择发行包

通常来说，安装 Python 有两种选择。一个是直接安装官网的安装包，另一个则是通过 Conda 来安装。

Python 官网，那么我们在 Download 下面可以看到 Latest 字样，点击右侧的 Python3.x 进入下载页面。拉到最下面 Files 中，选择 Windows x86-64 executable installer，就可以进行下载了。官网的 Python 呢只包含了最必要的组件。

Anaconda 官网，Anaconda 指的是一个开源的 Python 发行版本，其包含了 conda、Python 等 180 多个科学包及其依赖项，是一个 大而全 的 Python 版本。包含了 Spyder 集成开发环境和 Jupyter Notebook。同时 conda 这个工具呢也能够更好的帮你进行包和环境管理，特别是有一些包在 Windows 下安装容易出错。

如何选择：

如果你是初学者，不需要太多的功能，那么选择 Python 官网的版本
如果你即是初学者，但也需要接触数据科学相关内容（数据处理、人工智能等），那么安装 Anaconda 是不二之选
如果你有一定基础，但想要更多个性话的安装方式，不妨试试 Miniconda

注意：Anaconda 官网下载速度很慢，这里有国内镜像地址可以加快下载速度：清华大学镜像站、中科大镜像站。选择相应的安装包即可（通常在最下面）。

配置集成开发环境

在 Windows 下，有很多集成开发环境 (IDE) 可以用。虽然用记事本就可以写 Python 程序，但有了 IDE 之后能够大大提高开发效率。接下来介绍几种 Python IDE：

Visual Studio Code + Python 扩展
Spyder
PyCharm
Visual Studio 2017 + Python Tools

VS Code

再次安利一遍 VS Code，可以去这里下载。官网中有比较详细的配置和使用教程：Python in Visual Studio Code、Getting Started with Python 配置过程不复杂，弄好之后能够很方便的在 VS Code 中写代码和断点调试，同时享受 IntelliSense 智能提示的舒爽。

Spyder

Anaconda 自带的集成开发环境 Spyder，界面类似 MATLAB，非常好上手。十分适用数据科学，当然其它开发也是一样的。文档 spyder-ide/spyder

PyCharm

JetBrains 出品，必属精品。和 JB 家其它产品有着相似的体验。官网地址初学可以下载社区版，如果需要进行 Web 开发则可以使用其专业版。

VS2017 + Python 工具包

Visual Studio 2017 也加入了 Python 的支持。 Python 工具页中文安装文档这种方式略微笨重一些，当然如果你经常用 Visual Studio 的话也可以顺便装了。

Python 模块和包

Python 的模块非常丰富，因此你不怎么需要自己造轮子。一些大名鼎鼎的库诸如 Numpy、SciPy、Matplotlib 等。那么如何管理这些包？

Pip

pip是官方的包管理器，你可以方便的通过 pip install <包名> 来安装，也可以通过 pip list 来查看已安装的包。官方的包网站是 Pypi，这上面有所有可以通过 pip 安装的包。

Conda

如果你用的 Anaconda 的话，它提供了 conda 工具来进行包管理。conda install <包名> 当然有时候在国内因为网络问题安装太慢，那么可以使用国内镜像进行加速。

第三方包

在 Win 下，有时候安装包的时候会有奇奇怪怪报错，那么可以在下面的网站下载好编译好的 wheel 文件直接进行安装。下载好后到对应目录直接执行 pip install 文件名.whl Unofficial Windows Binaries for Python Extension Packages

Python技巧

使用国内镜像加速

通常安装包的时候因为服务器在国外所以速度很慢，那么可以通过切换到国内镜像源来加速 Python 包下载速度。通常有豆瓣、阿里、清华、中科大。

以清华的为例临时使用：

pip install -i https://pypi.tuna.tsinghua.edu.cn/simple some-package

想要修改为默认的可以参考清华的教程。

创建和管理虚拟环境

有时候我们需要运行别人的代码，可能它的包版本和我们不一样，为了创建一个完全的一样的运行环境，可以使用 virtualenv 等工具来创建虚拟环境。

virtualenv 和 venv

官方文档 2.x 下，首先你需要安装virtualenv，通常是使用 pip install virtualenv，注意使用管理员运行。Linux 下使用 sudo pip install virtualenv，这样 virtualenv 就会作为一个系统工具来使用。 $ virtualenv ENV 会创建一个 ENV 的文件夹，会把系统的 Python 环境拷贝一份到里面。Linux 的话直接 source ENV/bin/activate 就可以激活了。Windows 的话会在里面生成 activate.bat 文件。

3.x 版本则可参考官方文档，使用 venv 来创建虚拟环境。与 2.x 有一些差别。 python3 -m venv /path/to/new/virtual/environment

conda

Anaconda 也提供的 conda 工具也可以进行虚拟环境管理。而且可以选择 Python 版本。 conda create --name myenv 详情请见官方文档，这里不展开。和上面的 virtualenv 十分相似。

学习资源

在线教程

Python教程- 廖雪峰的官方网站：这个是著名的在线教程（但我并没有看过
Python 基础教程| 菜鸟教程
Python入门指南
简明 Python 教程：《A Byte of Python》中文版
Python入门-慕课网：视频教程
Python初学者（零基础学习Python、Python入门）书籍、视频、资料、社区推荐

等等，有很多，善用搜索引擎

书籍推荐

《笨办法学 Python》
《Python编程从入门到实践》

还有很多，这些书都很容易找到电子版，不需要买纸质。

在 WSL 中使用 Python

在最新的 Windows 更新中，你可以在应用商店中获取适用于 Windows 的 Linux 子系统。这样相当于有了一个 Ubuntu 运行在你的 Windows 中，这样安装一些包之类的也会很方便。这里有详细的安装教程。

之后使用 sudo apt install python 就可以安装 python 了。

等想到什么再更新吧~ 开始你的 Python 之旅吧！

在 Win 下愉快的使用 VS Code + LaTeX

Mon, 22 Jan 2018 21:29:45 +0000

想必大家都有被输入公式折磨过的时候，不妨学点 LaTeX (至今还不会读)。当我们需要专业的排版的时候，LaTeX 绝对是一个比 Word 更好的选择。本文带你在 Windows 下配置愉快的 LaTeX 工作环境。

前言

咳咳，今年 1 月 10 日正好是高德纳的 80 岁大寿。什么？你木有听说过这个老爷子？去百度百科瞅一眼，或者去他个人主页看看。他的代表作就是《计算机程序设计艺术》系列了。有兴趣可以去书店买一波书看看。emmm，扯远了，他还发明了 TeX，起因居然是他对当时的排版技术不满。

最先接触 TeX 的时候是因为需要在 Markdown 下面输入数学公式，于是接触了 MathJax（在浏览器内渲染数学公式）。不得不说，这种生成公式的方式很多情况下比 MathType 之类的可视化编辑器效率要高，但输一些很复杂的公式的时候还是会有些繁琐。一般的 Markdown 编辑器像 Typora 之类都有 MathJax 的支持了。还有一个非常有用的参考 MathJax basic tutorial and quick reference。

在线的 LaTeX 工具有 ShareLaTeX，非常好用，但是因为是在线工具，特别是国内网络会不稳定，加上在线编译其实是比较慢的。因此，如果是需要学术写作的话还是老老实实跟我来配置一个稳定快速的本地环境吧。

Windows下配置

用的组合是 MiKTeX + VS Code + LaTeX Workshop 插件

安装基础 TeX 环境

TeXLive or MiKTeX? 我也被这个问题困扰过。后来还是选择了 MiKTeX，因为 TeXLive 虽然大而全，但安装包就动辄上 G 了，我得节约一些硬盘空间。还是选择 MiKTeX，大家可以到它的下载页面下载，可以看到只要 191M，非常 nice！

下载后直接双击安装就行了。一路回车，安装完成之后就可以开始我们的下一步啦！

安装 VS Code

如果你安装好了，那么直接跳过这一段。如果你还没有安装好，那么我得再安利一遍微软爸爸的良心产品。

作为后起之秀的 Visual Studio Code 已经和老牌编辑器 Sublime Text 不相上下，甩了 Atom 很远了。

下载猛戳-> https://code.visualstudio.com/

安装插件 LaTeX Workshop

就快要完成啦。在 VS Code 左边最后一个按钮搜索 LaTeX Workshop 并安装，重新加载之后就可以了。当然，还需要一点设置才能更加愉快的使用。默认的编译器是 latexmk，然而 Windows 下这货没法愉快的使用。这当然没关系，绝大多数学术写作的场合我们需要的是用 pdflatex 生成 pdf 版本，用 bibtex 生成引文。我们可以按照该插件 GitHub 页面上的指导设置 pdflatex -> bibtex -> pdflatex -> pdflatex 的工作流，在 VS Code 的文件->首选项->设置里面添加上下面的这一段：

[更新于 2018.04] 上个月 LaTeX Workshop 更新了，采用了 recipe 管理 LaTeX 编译流程。简而言之就是你可以自定义 LaTeX 工作流。插件默认已经帮你写好了一些工具及参数，比如 pdflatex、latexmk 等。因此我们可以直接在 recipes 下面定义流程：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23


"latex-workshop.latex.recipes": [
{
"name": "pdflatex",
"tools": [
"pdflatex"
]
},
{
"name": "latexmk",
"tools": [
"latexmk"
]
},
{
"name": "pdflatex -> bibtex -> pdflatex*2",
"tools": [
"pdflatex",
"bibtex",
"pdflatex",
"pdflatex"
]
}
]

为了编辑的需要，我们还可以设置自动换行：

1
2
3
4


"[latex]":{
"editor.wordWrap": "on"
}
}

先点击左下角的按钮，生成一下项目，之后点击右上角的预览可以打开 pdf 的预览啦。就像上面的图里一样。之后每次修改保存后就会自动重新编译成 pdf 并更新右侧的预览，是不是很方便呢。如果出现问题，Ctrl+` 打开面板，在问题里面找到对应的问题并进行解决即可。

其它实用工具

PDF 工具

不得不说，Adobe Acrobat Pro DC 才是终极的 PDF 解决方案。从生成到编辑。

插图工具

最常用的图表绘制工具当然是 Excel 了。那么画出来的图表如何保存成高清图片呢？如果直接是在 Word 里面，可以直接复制 Excel 的图表，然后选择性粘贴 - Windows 增强元图格式，就可以插入清晰大图了。如果是要插入 LaTeX 文件，就需要导出 pdf 格式，那么可以选中图表之后打印，然后将图表高清打印出来，再用 Acrobat 裁剪，就可以插入到 LaTeX 文件之中。如果是 png 或者 jpeg 文件的图片，直接用 Adobe Acrobat 打开，再保存成 pdf 文件就可以了。

我用了 PDF Creator 来打印高清图表。当然，有了 Acrobat 之后应该是不太需要这个工具了。

EPS 格式文件转换

如果是要将 eps 格式插图和我们常用的 png, jpeg 之间进行转换要怎么做呢？一种方法就是用支持 eps 格式的程序将其打开，比如 Adobe Illustrator，再转成其它格式。Adobe Acrobat 好像也支持这个文件类型，我没有具体试过。

如何将 png，jpeg 文件转换成 eps 格式呢? 像 Photoshop 这样的软件当然是可以的。除此之外，我还发现 Image Magick 这个工具里面的 Convert.exe 可以实现这个功能。为了更好的压缩比可以试试 $ convert example.png eps3:example.eps，这样转换出来的 eps 文件不会太大。

其它教程链接 http://ddswhu.com/visual-studio-code-latex/

告别 2017，迎接 2018

Sat, 30 Dec 2017 02:17:33 +0000

记录一下我的 2017，祝各位 2018 新年快乐~

别往下看了，你看不完的。略略略

-----萌萌的分割线-----

岁末已至。再回首，365 天发生的许多事情恍如昨日。抓住 2017 的尾巴，我一直想写点东西来记录这不寻常的一年，那些人，那些事。顺便谈一谈自己对 2018 的期许。

上篇

故事就从四月说起。 4 月 8 日，我第一次见到了雷军本人。当然，他这次并非来演唱他的成名曲《Are You OK?》，而是参加“雷军奖学金”的颁奖典礼和创业论坛宣讲，我触动非常大。成功的企业家们在创业之路上经历了太多艰辛，我们看到的也只是那些少数佼佼者。我对雷军的创业价值观是非常认同的，当然也有校友加成。想起高三的时候喜欢和同桌打 (chui) 趣 (niu)：“大学毕业我就去创办一家香蕉 (Banana) 公司，然后把苹果收购了。”

随后的4月末，2017编程之美挑战赛正式在我们学校开始宣传。起初抱着吃瓜态度的我被我们微软俱乐部的技术组组长“甩锅”去进行Kickoff和技术分享。好在今年的主题非常有意思，关于 NLP(自然语言处理)和 Bot (聊天机器人)。在讲座的前一天晚上慌张入门 + 赶 PPT 赶到凌晨三点，再一次证明 DDL 才是第一生产力。于是第二天就一直处于共产主义凝视状态。附上讲课链接：编程之美 2017 培训——打造你的人工智能

时间来到五月。俱乐部换届，我成功晋升为“副”主席。算是达成了一个大学的小目标：体验一把~~学生会~~主席。带一个社团，我还真没有太多经验。就这样，一个菜鸟选手开始了他的领导体验。 5 月 12 日，看完一部神作《摔跤吧，爸爸》后，迎来一年一度微软 Build 大会，Project Emma 再一次给像我一样的软粉充值了一波信仰。微软，真的是一家有情怀，推动人类进步的公司。对了，这个月还上了一门有趣的课，不是微电子工业的发展，而是半导体与集成电路设计，认识了有趣的台湾来的老师，哦不，老哥。没想到 11 月的时候又能在上海重逢，不得不感慨命运的神奇。这一个月除了思考今天吃什么之外，也经常在思考人生，思考如何度过大学接下来的时光。毕业季了，学长学姐们各奔东西，逍遥快活去了。两年后的自己不知在何方。

匆匆到来的 6 月，成功被加朵女侠圈粉～ "It's not about deserve, it's about what you believe." 转眼迎来编程之美预赛的 DDL，和同样是 DDL 选手的队友 Touko 爆肝了一夜的 Tensorflow 最终还是爆炸了。第二天索性扔了个随机结果交差。就像充满玄学的 TF 一样，我们进了初赛。而且非常幸运的是，初赛的时间和考试完美重合。（我还能说什么）

7 月 5 号，带着大家顶着考试的压力，成功举办了编程之美线下活动——小美见面日。也因此为我们学校赢得多了两个微软夏令营的名额，环比增长 100%。在队友全在期末考试这种不利的局面下，我打算放弃编程之美的初赛了，毕竟晋级的希望看来如此渺茫。好在我考完还有 3 天才到 DDL，加上导师的“怂恿”，于是开启了独自打怪的模式。重操高中搞的 C#，边学边做，三天的极限操作，只能回答上自己名字的“人工智障”聊天机器人——“武大小土豆君”就此诞生。（谨以此纪念逝去的知名夜宵——小土豆）我把自己写的 Bot 模板公开了 bot-luis-qna，有需要的可以参考~

7 月 12 号，在懵逼之中被告知进决赛了。200 进 8，我应该提前去买几注大乐透的。成功把导师也拉过去了，土豪的微软爸爸包四星级酒店哦~ 这个月还选了两门暑期公选课。一门是《摄影技术与赏析》，炎炎夏日，背个相机在校园里游荡、尽情拍照。另一门是《基督教与中国文学》，大学里难得上到的文学性质的课，又带有宗教的元素，老师的谈吐我很喜欢。交完最后的报告老师特意发了一条短信来感谢我，很暖。

之后的主旋律就是电子设计大赛，上半年断断续续的在弄四轴飞行器。在一次次的 trial 和 error 之后，时间越来越紧迫。改硬件、改方案，熬夜调参，7 天刷 5 次夜这种事情也第一次体验。每天醒来第一件事情就是庆幸自己还活着。Hell! 最后进了国赛的复测，本以为胜券在握，最后被评委极限反杀。心寒！

等 8 月 12 日把电赛全部弄完之后，才能够全身心投入到编程之美决赛中。14 号去北京，15 号决赛。又是一波极限的操作，连夜部署了一个图像的服务。去北京之后才开始做 PPT，众人倒腾到凌晨 5 点。在上台展示之前我觉得自己都没法顺畅的讲下来，但有时候压力越大，爆发力就越强，面对台下一群大佬（只在微博里见过的那种），还是顺利完成了答辩。最后评奖，如愿以偿，拿到了第二，奖品 Surface Pro 4 的顶配，队友随后也成功拿到了 MSRA 实习的机会。感觉最后颁奖典礼邹欣老师唯一没有黑的就是我们队了，也替我们学校争了口气。附上我当时录的开箱视频。这一次获奖是整个团队齐心协力完成的，离开了任何一个人都无法走到最后。特别感谢我们的指导老师。

Ideas are cheap. What is hard is to implement them and to make them work.

Highlight of the year.

第二年参加微软夏令营~

随后 9 月迎来俱乐部的招新。宣传工作可能做的太好了，人数爆炸，超出预期。见到了许多有潜力有热情的新生。 10 月又和俱乐部的小伙伴参加了 Android 的应用比赛。因为时间太赶了，最后交了个半成品。不过合作开发还是乐趣无穷的。月底参加了 DoraHacks，好像是武汉为数不多的 Hackathon 活动。当然，我是去蹭吃蹭网的。见到了武汉其它高校厉害的同学。 11 月初又去上海复旦参加了 HACKxFDU，成功抽到了 Nvidia 的题，在N家的板子上做深度学习的应用部署。当然，我真实目的是去上海旅游的（逃。上海给我的印象很好。遇到了有趣的人与有趣的事。可能只是擦肩而过，但却难忘。后来想去参观一下上海的企业，就联系了陈老师。正好他参加一个 ARM 技术论坛，就把我请过去了。特意改签了火车，去长了一波见识。这种机会，在武汉真的太少了。

11 月中旬在我们学校举办了 Hackathon，虽然准备的过程全程出现 Bug，但最后效果还算不错，诞生了创意很好的项目。算是我在俱乐部办的比较成功的事了。希望一年能比一年好~

当然这个月女神泰勒也出新专辑了，成功的海淘到了。不禁想起了高中和初中买专辑的痛苦，一晃就这么多年了。Everything has changed. 九月申的加拿大 MITACS 的 Research Intern 也面试完了。没去成多伦多，要不我就可以在明年暑假看泰勒的演唱会了。看来得在一个山沟沟里专心搞我的项目了。当然，这个学期我也带了一个学期的 17 级小朋友的C语言上机，这届小朋友加油啊，不要浪费我给你们debug这么长时间。

再回首，2017 有很多很多值得细细回味的。但还是已经踏进了 2018 的大门了。是时候 Shake if off 了。

下篇

对 2018 也有太多的期许。不辜负自己和他人的期望。实现一些小目标，收获自己的小确幸。

首先把 17 年遗留下来的没有做的事情慢慢完成。比如要在博客上写的一些文章，记录之前的一些心得。比如做一些整理，收拾一下自己杂乱疲惫的身心。

很多计划的事情要接着一件一件落实。多看一些书修身养性，充盈一下自己的灵魂。更系统的学一些东西，不浮于表面。

享受生活，记录生活。 Be diverse and be myself.

还打算在俱乐部举办的一系列技术活动，予力众人成就更多。这是我觉得有价值和有意义的事情。

Try not be a man of success, but a man of value.

多多 Commit，少少 issue 和 bug。

希望自己能够顺利度过暑假。然后能够实现去微软亚院实习的梦想~（2017 没有趁着编程之美去实在可惜）不枉我粉微软爸爸这么多年。下半年十分关键。不知道会有怎样的 twist and fate，自己要做好准备。希望能顺利申到自己的 Dream School。

Done is better than perfect.

2018，遇见更好的自己~

祝大家新年快乐~

编程之美 2017 培训——打造你的人工智能

Sun, 23 Apr 2017 19:02:29 +0000

人工智能的时代已经来临，快来跟着本届编程之美来打造自己的人工智能吧。

编程之美 2017 官网：https://studentclub.msra.cn/bop2017/

这次编程之美的主题是人工智能，利用微软的 Bot Framework 和 Cognitive Services 为你的学校打造一个最美 Bot。这次的主题还是非常有意思的。我也趁着这个机会，学习了一下微软的 Bot Framework，体验一下这个框架。

人工智能可谓是当前最火的一个概念了。那么我们这次呢也是用这样的一个框架和微软的认知服务来实现一个人工智能的服务。为了使这次的课程更加有趣呢，我用了“打造你的人工智能'女友'”这样一个题目。其实并没有这么夸张，想要脱单还是得努力一把的~

当然，在使用了 Bot Framework 和 LUIS 之后，我们要打造的这个机器人会更加“智能”。

接下来请听详细分解：

Github 项目地址：https://github.com/mtobeiyf/bop2017-course

必应精美壁纸下载（持续更新）

Sat, 22 Apr 2017 19:06:03 +0000

喜欢必应精美壁纸的同学不要错过~ 文末附各个月的下载

[更新] 2017 年全年收录啦，2018 要开始了

我们都知道必应搜索一直都坚持每天更换一张精美的首页背景图片。很多年前就喜欢用必应的图片作为桌面壁纸。

以前 IT 之家有个板块叫壁纸之家，会定期更新上一个月的必应每日图片合集，只要做一个伸手党就可以了。然而去年更新的频率不仅变慢了，后来索性停更了。不得已，现在只能自力更生了。

此前，必应的每日美图都可以在 Bing Gallery中找到。几个月前这个网站也停更了。当然，还是有第三方网站一直在做，比如 Bing Wallpaper Gallery

现在已经养成习惯每个月上必应 Gallery 把上个月所有的每日图片手工扒下来。最近翻出了从 2015 年 10 月开始的必应壁纸合集，有刚刚过去的 2016 年全年的壁纸打包。2017 年的也会持续更新，敬请关注。

[2017 年 12 月更新] 又发现了一个很好的网站 bing.ioliu.cn，是一个国人制作的，非常精美和方便。大家有需要可以到这里下载。

下载地址

百度网盘

密码: h9hw

深度学习入坑 — Caffe 的安装

Wed, 25 Jan 2017 20:52:11 +0000

入坑深度学习，接触的第一个框架便是 Caffe，该如何在自己的电脑上搭建 Caffe 的框架呢？还真有点坑...

原文发布于深度学习入门爱好者如何使用Caffe搭建一个简单可训练学习的识别系统？ - Fing的回答 - 知乎

注：本文最初写于 2016.12.16，部分内容可能有点过时。

Caffe，全称 Convolution Architecture For Feature Extraction，是一个清晰且快速的深度学习框架。

配置 Caffe

成功在 Windows 平台和 Ubuntu 平台配置好了 Caffe。下面会讲一下如何在这两个平台配置 Caffe。一开始在配置 Caffe 的过程中遇到了各种神坑。强烈推荐使用 Ubuntu 平台！ Caffe 官网地址：Caffe | Deep Learning Framework Github 地址：BVLC/caffe

Ubuntu 16.04 下的配置

官网的教程其实比较详细了，推荐用 Python 接口。 Caffe | Installation: Ubuntu

安装各种依赖库

1
2


sudo apt-get install libprotobuf-dev libleveldb-dev libsnappy-dev libopencv-dev libhdf5-serial-dev protobuf-compiler
sudo apt-get install --no-install-recommends libboost-all-dev

1

sudo apt-get install libgflags-dev libgoogle-glog-dev liblmdb-dev

安装Python

1

sudo apt-get install python-dev

然后把 Caffe 的源代码下载下来: git clone https://github.com/BVLC/caffe.git (当然没有安装 Git 的得先安装一下) 下载完成之后,进入 Caffe 文件夹, 进入里面的 Python 文件夹,然后输入

1

for req in $(cat requirements.txt); do pip install $req; done

这一步是安装所有 Python 的依赖包，如果没有安装Pip的话可以 sudo apt install python-pip 来安装。

第二部分: 编译安装 Caffe

到 Caffe 文件夹, 使用模板写个 Makefile.config。具体就是先复制一下模板, 再改一些内容

1

cp Makefile.config.example Makefile.config

因为我们暂时使用 CPU 模式, 所以在 CPU_ONLY := 1 前面的 # 要去掉.
两个路径要改成这样:( 添加后面的两个 hdf5 的路径, 否则编译时报 hdf5 错误 )

1
2
3


# Whatever else you find you need goes here.
INCLUDE_DIRS := $(PYTHON_INCLUDE) /usr/local/include /usr/include/hdf5/serial
LIBRARY_DIRS := $(PYTHON_LIB) /usr/local/lib /usr/lib /usr/lib/x86_64-linux-gnu/hdf5/serial

准备好了，我们就可以开始编译。

1
2
3
4


make pycaffe
make all
make test
make runtest

结果显示 ALL TESTS PASSED 就安装好了, 只需要再加上一个 PYTHONPATH; 另外, 这个 make 默认是用 CPU 单核运算,如果想要快一点, 比如我想使用四核, 在 make 后面加上 -j4 标签. 如果上面 4 行某一行报错之后想要重试,建议先 make clean 再重新开始.

第三部分: 设置 Python Caffe

去到 Caffe 文件夹里面的 python 文件夹, 把当前路径记录下来 pwd。然后输入以下命令(把记下的路径放在相应地方)

1

export PYTHONPATH=/path/to/caffe/python:$PYTHONPATH

这时候应该可以了,试验一下:

1
2
3
4
5
6


$ python2.7
Python 2.7.12 (default, Jul 1 2016, 15:12:24)
[GCC 5.4.0 20160609] on linux2
Type "help", "copyright", "credits" or "license" for more information.
>>> import caffe
>>>

说明安装全部完成!

一些参考文档：

Ubuntu 16.04上安装Caffe(CPU only) Caffe for Python 官方教程(翻译) Ubuntu16.4系统下为Python配置caffe环境 - 爱吃鱼的猫 - 博客频道 - CSDN.NET

Windows下的配置

预先准备

编译环境：Visual Studio 2013 ~~Visual Studio 2015~~ 当时编译不能用 2015，最新的好像是可以了，一切请参考微软 Caffe Github 页面的说明！

GPU 工具：CUDA 8.0 下载完后把 -exe 改为 .exe，直接安装即可。 Python 2.7 cuDNN x64 把链接复制到迅雷等下载工具中即可，否则就注册账号，按官网提示下载。 https://developer.nvidia.com/cudnn

之后我们到微软在Github上提供的 Caffe 下载页：Microsoft/caffe

下载好了 ZIP 文件后，解压到任何位置，将文件夹改名为 caffe

编译配置

1.打开 caffe 文件夹，再打开 windows 文件夹，将其中 CommonSettings.props.example 文件复制一份，改名为 CommonSettings.props

2.解压 cudnn-8.0-windows10-x64-v5.1.1.zip 压缩包，得到 cuda 文件夹，将其复制到 caffe 文件夹下

3.接下来我们编辑配置文件。右击 CommonSettings.props，使用记事本或者其它文本编辑器打开。将其中 CudaVersion 后面的 7.5 改为 8.0 CuDnn 是指定之前 cuda 文件夹的路径，我把 caffe 文件夹放在了 D:\Workspace 下，因此这里填了 D:\Workspace\caffe

4.找到路径 C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v8.0\extras\visual_studio_integration\MSBuildExtensions 文件夹，将其中的所有文件复制到 C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4.0\V120\BuildCustomizations 中

5.这时候再打开 Caffe.sln，就可以全部正常加载了。

开始编译

1.右击 libcaffe，选择 Properties 2.属性设置为如图所示

3.之后再把 libcaffe 设置为启动项目

同时改上面编译为 Release

4.构建 libcaffe

这一过程会比较漫长，因为 NuGet 会从网上把所有依赖文件全部下载到本地。大概有 1 个 G 左右。在 Workspace 文件夹下可以看到 NuGetPackages 文件夹，里面就是编译用到的包。

注意VS的输出窗口，看看 Build 是不是 Succeeded 了。编译好了后会出现一个 Build 的文件夹，进 caffe\Build\x64\Release 看看是否有相关文件

5.此时，同理可以编译 caffe 也可以直接编译 Solution，把所有 caffe 的组件全部编译好。

在 Release 文件夹里，就可以看到编译好的 caffe 了

配置好了之后，就可以开始搞事情了~

参考： Windows+VS2013爆详细Caffe编译安装教程

Fing 2016.12.16

Arduino 寝室智能门禁（刷卡 + 手机蓝牙）

Tue, 30 Aug 2016 23:23:23 +0000

出门 忘带钥匙，回来又碰巧室友一个都不在，只能在门口干等；躺在床上，有人敲门，又得起身下床开门…… 懒癌附体，无药可治。于是在暑假，利用了两天时间，倒腾出来这个智能门禁。且听我慢慢分解。

左图是门内的效果，右图是门外的校园卡感应器。

元件清单

Arduino Uno R3

核心控制部分，其它元件调度的 “大脑”。其实还考虑过 Arduino Nano，体积更小。但是在实际使用的时候出现过电流过小，无法稳定驱动舵机的情况。故为了稳定性，选择使用 Arduino Uno。

RC522 IC 卡识别模块

核心模块之二，兼容大多数主流的 MIFARE 标准的 IC 卡。可以通过它来读取校园卡的 UID (唯一标识符) 的值，从而达到身份验证的效果。

舵机 MG996R

没有用常见的 SG90 舵机是因为用舵机拉门栓需要挺大的力的。所以用了贵一点的 MG996R，保证扭力足够，能够拉动门栓。

HC-06 蓝牙模块

工作在丛机模式下，负责接收数据。

蜂鸣器等

蜂鸣器用来进行提示：刷卡成功 “滴” 一声，失败就 “滴 — 滴” 两声。细的漆包线：IC 卡识别模块需要用 7 根线和 Arduino 进行连接，而且门缝比较窄，所以没有用普通导线。数据线：一般买 Arduino 自带。 热熔胶抢：固定走线、固定各种元件用。

硬件制作

第一张图上可以看到，我将所有的元器件固定在了一个洞洞板上，焊了一些排针方便拔插。还可以保证整体性，更加简洁。当然也可以用杜邦线飞，但杜邦线不稳，容易掉。而且飞线太多也不太好看。

软件制作

控制舵机、蜂鸣器是小菜一碟，Arduino 的新手必备技能。下面主要说说蓝牙模块和射频模块的使用。 蓝牙模块 使用方法可以见我另一篇文章中的总结：[Arduino] HC-06 蓝牙模块使用小结 RC522 模块 GitHub 上有功能完整的库和丰富的示例了：rfid 在 Readme 中有 RC522 与 Arduino 的接口说明。第三方库的使用自行搜索。之后就可以在 Arduino 工程文件中直接 #include <MFRC522.h> 了。

详细源代码：GitHub

注意：供电的电源一定要好，不然电机很有可能无法驱动。最好用 5V 1.2A 来进行供电

有更多问题欢迎提问。

MATLAB 串口通信与动态绘图

Tue, 02 Aug 2016 23:38:29 +0000

有时候在调试一些单片机等外设时，现有的串口软件往往不能胜任我们数据处理的需求。而自己写一个上位机软件实在是小题大做了。那么 MATLAB 其实时支持从串口读取数据的，再借助 MATLAB 强大的数据处理与分析函数，就能实时可视化传感器等数据了。

MATLAB 基础可以参考我之前的文章『MATLAB 学习笔记』导航 & 资源 & 笔记

MATLAB 串口通信

MATLAB 本身是支持 Serial Port Devices，即串口设备。通过自带的一些函数可以操作串口（读取、写入等）官方英文教程

然而在实际使用中，我的和官方给出的例子有一些不同。下面给出一个完整的串口读取的例子：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


% 新建串口对象
s1=serial('COM15','BaudRate',9600);
% 尝试代开串口
try
fopen(s1); % 打开串口对象
catch err
fclose(instrfind); % 关闭被占用的串口
error('请确认选择了正确的串口'); % 输出错误提示
end
a=fscanf(s1,'%d'); % 读取数据
fclose(s1); % 关闭串口

MATLAB 动态绘图

要实现读取一个数据，然后实时更新图像。而不是已知所有点坐标再进行绘图。

动态曲线

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


h = animatedline; % 创建空白动态曲线
axis([0 40 5 30]) % 设置坐标系范围
x = linspace(0,40,800);
xlabel('时间');
ylabel('距离');
for k = 1:length(x)
y =(fscanf(arduino,'%d')/100.0);
addpoints(h,x(k),y);
drawnow
end

可以实现从串口实时读取数据并进行显示。最终效果类似心电图。

动态点坐标

这个挺头疼的。因为我不需要两点之间连线，而是类似随机的散点。最终用 clf 的命令解决了问题。代码如下

1
2
3
4
5
6
7
8
9


n = 500;
for i = 1:n
clf; % 清空
a =(fscanf(s1,'%d')/100.0);
b =(fscanf(s2,'%d')/100.0);
plot(px,py,'or','MarkerSize',5,'MarkerFaceColor','r');
axis([0 40 0 40]);
drawnow;
end

还有其他动态绘图的方法，比如 comet() 函数、hold on 等用法。可以自行百度。但我之所以不采用这些方法的原因是因为它们的坐标系是会变化的，不固定。

MATLAB 初学者，若有不足，请指正。

Arduino HC-06 蓝牙模块使用小结

Tue, 02 Aug 2016 07:22:23 +0000

简介

蓝牙，顾名思义，蓝色的牙齿，并不能用来咬人，而是一种无线数据传输标准。 HC-05 和 HC-06 是现在使用较多的两种蓝牙模块。两者之间的区别是 HC-05 是主从一体机，既能向自己的“主子”打小报告，也可以接收下达的命令；而 HC-06 只能工作在从机模式下，那就只能乖乖接收上级的命令啦。在很多情况下，我们都想当“霸道总裁”，让下级乖乖听话就 OK 了，不需要他多废话。那就用 HC-06 就够了。下面是 HC-06 的模块示意图：

可以看到它有 4 个引脚，那么它接线如下：

在这里，我并没有使用 Arduino 的 0,1 号口，而是使用了两个数字口。这样就不会占用 Arduino 自身的串口。

AT模式

在按照上面的接线之后，HC-06 会自动进入 AT 模式，在这个模式下，可以通过串口对蓝牙模块进行一些诸如修改名称、密码的操作。注意：AT 命令一定要大写，中间的“+”不可省略

指令	返回	功能
AT	OK	确认连接
AT+VERSION	OKlinvorV1.8	查看版本
AT+NAMExxxx	OKsetname	设置蓝牙名称
AT+PINxxxx	OKsetPIN	设定密码
----	----	----
AT+BAUD1	OK1200	波特率设为1200
AT+BAUD2	OK2400	波特率设为2400
AT+BAUD3	OK4800	波特率设为4800
AT+BAUD4	OK9600	波特率设为9600
AT+BAUD5	OK19200	波特率设为19200
AT+BAUD6	OK38400	波特率设为38400
AT+BAUD7	OK57600	波特率设为57600
AT+BAUD8	OK115200	波特率设为115200

其中 xxx 替换成自己想要的。不建议设置更高的波特率，通信会不稳定

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29


/*
 Name: Bluetooth.ino
 Created: 2016/7/30 13:26:47
 Author: Fing
*/
#include <SoftwareSerial.h>
// 使用软件串口，能讲数字口模拟成串口
SoftwareSerial BT(8, 9); // 新建对象，接收脚为8，发送脚为9
char val; // 存储接收的变量

void setup() {
Serial.begin(9600); // 与电脑的串口连接
 Serial.println("BT is ready!");
BT.begin(9600); //设置波特率
}
void loop() {
// 如果串口接收到数据，就输出到蓝牙串口
 if (Serial.available()) {
val = Serial.read();
BT.print(val);
}
// 如果接收到蓝牙模块的数据，输出到屏幕
 if (BT.available()) {
val = BT.read();
Serial.print(val);
}
}

连接 Arduino，写入程序。进入串口，输入 AT，看看是不是有 OK 返回。之后就可以愉快地使用 HC-06 模块了。

手机连接调试蓝牙

通过 SPP 蓝牙助手可以实现连接蓝牙和与蓝牙之间的通信。我用的是 unWired Lite，可以在 Play 市场上下载到。有些国内开发者也有相关的作品，自行搜索便可。

『MATLAB 学习笔记』导航 & 资源 & 笔记

Sat, 23 Jul 2016 09:03:20 +0000

在 Coursera 上学习 MATLAB 课程的过程中，自己把笔记整理总结了一下，一方面方便自己日后的参考，另一方面也提供给大家一些资源和经验。

MATLAB 程序设计入门

【前言】这一部分偏重的是基于 MATLAB 的程序设计，即编程的方法，当然也包含了很多 MATLAB 的基础操作。个人觉得，之后对 MATLAB 一些工具的使用在有了 MATLAB 的编程基础的前提下回变得相对的轻松。

我是在 15 年下半年（大一）在 Coursera 学习了这一门课 MATLAB 程序设计入门，英文课程，总体难度不大，毕竟是针对初学者的课程。但有一些章节的课后作业还是挺有难度的。下面是我在学习这一课程过程中的笔记，因为是在课余学习的，只记了关键的一些操作与命令。考虑会在后续补上截图与操作。

MATLAB 应用

MATLAB 串口通信与动态绘图

后续不断补充

Mathworks 官方资源

矩阵的操作

克隆运算符（Colon Operator）

x=1:3:7 生成数组 1 4 7 表示 x 从 1 开始逐加 3，到 x<=7，相当于 for (i=1; i<=7; i+=3) 这样一个循环。 x=1:100，生成 1 2 3...100 序列，即中间参数没有指定时默认逐加 1。

操作矩阵的一部分（Access Parts of a Matrix）

有如下的一些方法：假设 x= 1 2 3 4 5 6 7 8 9

x(2,3) 矩阵 x 第 2 行，第 3 列的元素 6 x(end,2) 矩阵 x 最后一行，第 2 列的元素 8 x(2,[1 3]) 矩阵 x 第 2 行的第 1 列和第 3 列的元素 4 6 x(2,1:3) 第二行的 1,2,3 列元素 4 5 6 x(:,2) 第 2 列所有元素 [m,n] = size(x) 得到 m 为行数，n 为列数 sum(x) 对逐列求和，输出每列和的行向量 12 15 18

矩阵生成（Matrix Building）

指定元素

zeros(5,6)：5×6 的方阵，元素全为 0 ones(4,2)：4×2 的方阵，元素全为 1 5*ones(4,2)：元素全为 5 zeros(4)：4×4 的方阵 diag(7 3 9 2)：对角阵，7 3 9 2 位于其主对角线上，其余元素全为 0

随机元素

rand(3,4),rand(5)：分别生成 3×4 和 5×5 的矩阵，元素值 0-1 fix(1+rand(5,4)*10)：fix 为取整 randi(10,4,5)：生成 1-10 的 4×5 矩阵 randi([5 10],4,5)：生成 5-10 的 4×5 矩阵 randn(1,1000)：n 代表 normal，按正态分布生成随机数

随机数生成器（Random Generator） 每次打开 MATLAB 后 rand 的值便固定了。需要重置随机数。 rng(参数)，参数部分可以是数字，可以是字符串。

函数与脚本

函数 - Function

MATLAB 自带了丰富的函数，当然我们也可以自定义函数来实现自己想要的功能。比如：rand(3,4) 就能生成 3×4 的数表，每个数在 0~1 之间。输入 edit 编辑新文件

1
2
3


function myRand
a=1+rand(3,4)*9
end

保存为 myRand.m，这样就定义了一个 myRand 函数，用来生成 1-10 之间的数。其中 a 为局部变量，只在其作用域 (myRand) 中有效。就这样执行 myRand 结果会被保存在变量 ans 中。

修改一下第一行：function a = myRand，本意是想输出 a，运行之后会发现输出了 a=... ans=... 两个部分。想要只输出 ans，只需在 a=1+rand(3,4)*9 后加上 ; 输入 b=myRand 便可将值保存到变量 b 里。将函数修改一下

1
2
3


function a=myRand(low, high)
 a=low+rand(3,4)*(high-low);
end

就可以输出在low~high之间的随机数表了。若想输出a中的全部数字的和，则可以改成如下

1
2
3
4
5


function [a,s]=myRand(low, high)
 a=low+rand(3,4)*(high-low);
v=a(:);
s=sum(v);
end

然后在命令行中输入 [x ss]=myRand(1,10) 就会分别输出数表 x 及所有数字之和 ss

function 的定义

1
2


 funtion [out-arg1, out-arg2, ...]
=function-name(in-arg1, in-arg2, ...)

不确定函数名是否已定义，可以用 help exist

subfunction - 定义多个 (子) 函数

举个栗子

1
2
3
4
5
6


function [a, s] = myRand(low, high)
 a = low+rand(3,4)*(high-low)
s = sumAllElements(a);
function summa = sumAllElements(M)
 v = M(:);
summa = sum(v);

全局变量

1
2


global v;
v=(...);

一定要分开写 新手尽量少使用，可能会导致难检测的错误。

function 的优点

将一个大问题分解
功能的分解
代码复用
普遍性

Script - 脚本

是一个 .m 文件，用来执行一系列命令、赋值等计算执行脚本时只需输名字

1
2
3


fprint('This is matlab\n');
pause(5);
quit;

分支结构

if语句

function guess_my_number(x)
if x == 2
fprintf('Congrats! You guessed my number!\n');
end

注意每个 if 语句都要以 end 结尾

if-else语句

function guess_my_number(x)
if x == 2
fprintf('Congrats! You guessed my number!\n');
else
fprintf('Not right, but a good guess.\n');
end

if-elseif-else 语句

1
2
3
4
5
6
7
8


function guess_my_number(x)
if x == 2
fprintf('Congrats! You guessed my number!\n');
elseif x < 42
fprintf('Too small. Try again\n');
else
fprintf('Not right, but a good guess.\n');
end

最后一个 else 可以不要，就是一个 if-elseif 结构。

关系运算符（Relational operators）

运算符	含义
==	判断是否等于
~=	是否不等于
>	是否大于
<	是否小于
>=	是否大于等于
<=	是否小于等于

进行判断后返回值为 1 (真) 或 0 (假)

可以进行一组数的比较

1
2


[4 -1 7 5 3] > [5 -9 6 5 -3]
ans = 0 1 1 0 1

当然也可以这样，逐个与 4 进行比较：

1

[4 -1 7 5 3] <= 4

还有很多玩法

1

sum([14 9 3 14 8 3] == 14)

逻辑运算符（Logical operators）

运算符	含义
&&	逻辑与
\|\|	逻辑或
~	逻辑非

输入		&&	\|\|
false	false	0	0
false	true	0	1
true	false	0	1
true	true	1	1

非零为真，零为假

1
2


~[1 pi 0 -2]
ans = 0 0 1 0

但对两个矩阵使用 && 和 ||，应变为 & 和 |

1
2


[1 -3 0 9 0] & [pi 0 0 2 3]
ans = 1 1 0 1 1

help precedence 获取关于运算符优先级的帮助

循环嵌套（Nested if-statements）

1
2
3
4
5
6
7
8
9


if arg_1
if arg_2
statement_1;
else
statement_2;
end
else
statement_3;
end

多态函数

多态函数（Polymorphic functions）

什么是多态

是指函数可以根据输入输出的表达式个数和类型作出不同的反应。举个栗子：zeros(5,6) 生成 5×6 矩阵，zeros(4) 生成 4×4 的矩阵。 MATLAB 中许多内置的函数是多态的（sqrt, max, size, plot, etc.）

如何使自己的函数具有多态性？

nargin: 返回实际的输入参数的个数 nargout: 返回实际要求的输出参数个数

下面这个函数 multable(n,m) 生成 n×m 的数阵，我们来使其具有多态性

1
2
3
4
5
6
7
8


function [table summa] = multable(n,m)
if nargin < 2
m = n;
end
table = (1:n)' * (1:m);
if nargout == 2
summa = sum(table(:));
end

[table s] = multable(3,4)，会输出 3×4 的数表和其所有元素和 table = multable(5)，只会输出 5×5 数表

健壮性（Robustness）

一个健壮的函数，会对各种可能出现错误的情况进行处理。上面的函数可以进行如下的优化：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28


function [table summa] = multable(n,m)

% MULTABLE muliplication table.
% T = MULTABLE(N) return an N-by-N matrix
% containing the multiplication table for
% the integers 1 through N.
% MULTABLE(N,M) returns an N-by-M matrix.
% Both input arguments must be positive integers.
% [T SM] = MULTABEL(...) returns the matrix
% containing the multiplication table in T
% and the sum of all its elements in SM
if nargin < 1 % 没有输入
error('must have at least one input argument');
end
if nargin < 2
m = n;
elseif ~isscalar(m) || m < 1 || m ~= fix(m) % 参数不为正整数
error('m needs to be a positive integer');
end
if ~isscalar(n) || n < 1 || n ~= fix(n)
error('n needs to be a positive integer');
end
table = (1:n)' * (1:m);
if nargout == 2
summa = sum(table(:));
end

% 后为注释，在命令行中输入 help multable，可以得到最上面一大段注释作为 help 的内容

持续变量（Persistent variables）

和全局变量类似，但又有所区别。

1
2
3
4
5
6
7
8


function total = accumulate(n)
persitent summa;
if isempty(summa)
summa = n;
else
summa = summa + n;
end
total = summa;

也就是说，再次调用这个函数的时候，summa 的值是接着上次的值的。重置：clear accumulate

输入输出和绘图

输入 & 输出（Input&Output）

1
2
3


function a = one_more
x = input('Gimme a number, buddy:');
a = x+1;

上面实现了输入一个 x，并将 x+1 赋值给 a，input 括号中的为控制台输出的提示信息。

1

fprintf('This is an output example\\n')

输出一行信息

1
2
3


function check_out(n,price)
total = n*price;
fprintf('%d items at %.2f each\\nTotal = $%5.2f \\n',n,price,total);

fprintf 中的 f 代表 format，即格式化。

%d，整数 %.2f，f 代表 fixed point，小数位为 2 位 %5.2，共 5 位（包括小数点），小数点后 2 位。

1

fprintf('%4.1f\\n',[1 2 3])

会输出

绘图（Plot）

1
2


a =(1:10).^2
plot(a)

绘图一般是先生成数列，再绘图

plot(t,b)，以 t 为 x 轴，b 为 y 轴 figure(2)，新建第 2 个空白的图像，如果有就切换到这个图像

1
2
3


x1 = 0:0.1:2*pi; y1 = sin(x1);
x2 = pi/2:0.1:3*pi; y2 = cos(x2);
plot(x1,y1,x2,y2)

自定义图像样式 plot(t,b,'m--o')，最后一个参数中，m 表示 magenta (品红色)，-- 表示虚线，o 表示小圆圈标出每个点。可以在 help plot 中找到更多相关参数

hold on 在当前 figure 上保留画出来的图像，可以再做图像。与之相对的是 hold off plot(x2,y2,'r:')，红色连续点线，plot(x1,y1,'g*')，绿色，点用 * 表示 grid，打开网格 title('xxxx')，加上标题 xlabel('xxxx')，x 轴加上标签 ylabel('xxxx')，y 轴加上标签 legend('sine','consine')，图例说明 axis([-2 12 -1.5 1.5])，指定 x 轴从 - 2 到 12，y 轴从 - 1.5 到 1.5 close(1)，关闭 figure1 close all，关闭所有图像

数据类型

数据类型（Datatypes）

同其他的编程语言一样，MATLAB 也有许多的数据类型。下面我们来看看我们用过哪些数据类型。

class(arg) 可以返回 arg 的类型。如：

1
2


>> class(0)
ans = double

whos 命令可以列出当前工作区域变量的详细信息。

数字类型（Numerical Types）

双精度实数（Double）

MATLAB 中默认的数据类型
浮点表示形式，例如：12.34 = 1234 * 10^-2
内存占用：64 bits（8 bytes）

单精度实数（Single）

与双精度类似。
内存占用：32 bits（4 bytes）

整数类型（Integer types

分为有符号（Signed）、无符号（Unsigned）两类
内存占用：8, 16, 32, 64 bit long

数据类型	范围
int8	-2⁷~2⁷-1
int16	-2¹⁵~2¹⁵-1
int32	-2³¹~2³¹-1
int64	-2⁶³~2⁶³-1
uint8	0~2⁸-1
uint16	0~2¹⁶-1
uint32	0~2³²-1
uint64	0~2⁶⁴-1
single	-3.4×10³⁸~3.4×10³⁸
double	-1.79×10³⁰⁸~1.79×10³⁰⁸

一些实用的函数

类型检测

class 返回类型

isa 返回是否是这个类型，例如

1

>> isa(x,'double')

范围检测

intmax intmin

realmax realmin

1

>> intmax('uint32')

类型转换

1
2
3


int8(x)
uint32(x)
double(x)

需要说明的是，当一个变量重新赋值时，会转换为所赋值的类型。

字符串（Strings）

字符串，顾名思义，是由一串字符组成的。

在 MATLAB 中，字符串其实是一个向量，其中的元素自然是字符（char），字符又是由 ASCII 码值，可以得到一个打印所有可见字符的例子：

1
2
3
4
5


function char_codes
for ii = 33:126
fprintf('%s',char(ii));
end
fprintf('\n');

MATLAB 中，有一些常用的操作字符串的函数：

函数	作用
findstr	找到字符串中的子串
num2str	将数字转换为字符串
str2num	将字符串转换为数字
strcmp	比较两个字符串
lower	将字符串转换为小写
upper	将字符串转换为大写
sprintf	将结果写入字符串中

具体使用方法可以参考 MATLAB 自带的 WIKI

注：strcmp 在比较时严格区分大小写，若忽略大小写，可以用 strcmpi

sprintf 的用法和 fprintf 用法基本一致，但区别在于 sprintf 返回一个字符串

结构体类型（Structs）

众所周知，在 MATLAB 中，一个数列只能包含类型相同的一组数据，那我们需要存储类型不同的数据怎么办呢？结构体就能做到。

结构体和数组的区别：

结构体的基本单位是字段 (fields) 而非元素 (elements)
我们访问结构体时用的是字段名称 (field name) 而非索引 (indices)
字段可以有不同的数据类型 (甚至是另一个结构体)

灵活性：字段可以包含子结构体；结构体可以包含数组，同时数组元素也可以是结构体

下面来实践一下：

1
2
3
4
5
6
7
8


>> r.ssn = 12345678
% 以上定义了一个结构体 r
>> r.name = 'Homer Simpson'
% 继续添加其它类型的字段
>> r.address.street = "742 Evergreen Terrace"
% 这里的 r.address 就是一个子结构体

一些常用的操作结构体的函数：

函数	作用
isfield	判断结构体中是否有字段
setfield	动态添加字段
rmfield	删除结构体中的一个字段
struct	快速构造一个结构体

结构体数组：在已经定义了一个结构体的前提下，可以快速构造结构体数组。已知 account 为一个结构体

1
2
3
4
5
6


>>account(2).number = 7654321;
account =
1×2 struct array with fields:
number
balance
owner

值得注意的是，在 account(2) 中，除了赋过值的 number 字段外，其它字段初始为空

在一个结构体数组中，如果一个结构体的字段是一个子结构体，那么这两个子结构体不一定要相同。

注意：在使用 rmfield 时，应将返回值赋给要删除字段的结构体。

元胞数组（Cells）

这种类型也是 MATLAB 独有的，类似于 C 语言中的指针 (Pointer)，但一个元胞 (Cell) 并不直接存内存的地址，而是指向某变量。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


%% The Ultimate Legend of Big John 相当于段落文本
page{1} = 'You could find him on the field almost any day.';
page{2} = 'Tall, dark hair, and eyes of steel gray.';
page{3} = 'They say he pulled a Frisbee ''bout half a mile,';
page{4} = 'And when he''d stick in the corner, you could almost catch a smile';
page{5} = 'On Big John.';
%% 打印输出
fprintf('\n');
for ii = 1:length(page)
fprintf('%s\n',page{ii});
end
fprintf('\n');

可以看出元胞数组的定义是用了一对花括号 {}，而里面的数字类似于数组的索引。此外，你可以这样构建元胞数组：

1
2


p = cell{2,3}
p{1,2} = 'Awesome'

类似于 2×3 的数组。但里面的每个元素都是元胞 (Cell)

注意：MATLAB 不允许两个元胞指向同一个对象，也就是说，当你令 c2 = c1 时，虽然表面上 c2 的数据和 c1 是一样的，但 MATLAB 悄悄地将 c1 的数据拷贝到了新的内存地址中，也就是 c2 指向的数据地址和 c1 指向的数据地址是不一样的。

还有许多实用的函数可以操作元胞数组，有兴趣可以看一下官方文档。

文件操作

文件操作（File IO）

使用文件有诸多优点：首先它是被一直存储在硬盘中的，它里面储存着信息，文件可以由操作系统轻松的管理，文件同时也可以被复制和移动，可以被不同软件访问。对于 MATLAB，它不仅可以处理其专有文件格式 (.mat .m)，还可以处理 txt 文本文档、二进制文件，甚至 Excel 文件。

pwd 命令可以显示当前所在的目录 (Print Working Directory) ls 命令可以列出当前目录下所有文件 cd 命令可以改变目录 (Change Directory)

1
2
3
4
5


cd('Lesson 08') % 进入当前文件夹下的 Lesson 08 文件夹
cd('..') % 返回上级目录
cd('../..') % 返回上上级目录
mkdir('folder') % 创建新目录
rmdir('folder') % 删除空目录

save 命令可以保存当前工作区 load 命令可以加载当前工作区

1
2


save my_data_file data s a % 将变量 a 和 s 保存至 my_data_file.mat
load my_data_file % 从 my_data_file.mat 中加载变量

Excel 文件操作

MATLAB 支持读取和写入 Microsoft Excel 文件。需要用到 xlsread 和 xlswrite 两个函数。

1

>> [num,txt,raw] = xlsread('Nashville_climate.xlsx')

num 元素包含了表中所有的数字，txt 则是包含了文字，raw 储存了所有

1
2
3
4
5
6
7


>> temps = xlsread('Nashville_climate.xlsx') % temps 包含有数字
>> [temps txt] = xlsread('Nashville_climate.xlsx')
>> [~, text] = xlsread('Nashville_climate.xlsx') % 只输出 text
>> [~, ~, everything] = xlsread('Nashville_climate.xlsx')
>> num = xlsread('Nashville_climate.xlsx', 1, 'D15:E17')
% 数字 1 表示工作簿，D15 指定了 D15 这个单元格
>> num = xlsread('Nashville_climate.xlsx', 1, 'D15:E17')

至于 xlswrite，可以写入 CSV 文件。不详细讨论了。

txt 文件操作

1
2


fid = fopen(filename, permission);
fclose(fid);

其中 permission 这个参数可以有很多，如：rt wt at r+t w+t a+t

下面用一个示例来进行 txt 文件读取操作的演示。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


function view_text_file(filename)
fid = fopen(filename,'rt');
if fid < 0
error('error opening file %s\n', filename);
end
% Read file as a set of strings, one string per line:
oneline = fgets(fid);
while ischar(oneline)
fprintf('%s',oneline) % display one line
oneline = fgets(fid);
end
fprintf('\n');
fclose(fid);

再来看看如何写入 txt 文件。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58


function write_temp_precip_txt(filename)
Title_1 = 'Climate Data for Nashville, TN';
Title_2 = '(Average highs(F), lows(F), and precip(in)';
Label_1 = 'High';
Label_2 = 'Low';
Label_3 = 'Precip';
Mo_1 = {'Jan','Feb','March','April','May','June'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Mo_2 = {'July','Aug','Sep','Oct','Nov','Dec'};
Data_1 = [
46 28 3.98
51 31 3.7
61 39 4.88
70 47 3.94
78 57 5.08
85 65 4.09];
Data_2 = [
89 69 3.78
88 68 3.27
82 61 3.58
71 49 2.87
59 40 4.45
49 31 4.53];
fid = fopen(filename,'w+t');
if fid < 0
fprintf('error opening file\n');
return;
end
fprintf(fid,'%s\n',Title_1);
fprintf(fid,'%s\n',Title_2);
fprintf(fid,'\n');
fprintf(fid,' %s%s%s\n',Label_1,Label_2,Label_3);
for ii = 1:6
fprintf(fid,'%5s: ',Mo_1 {ii});
fprintf(fid,'%5.2f,%5.2f,%5.2f\n',Data_1(ii,:));
end
fprintf(fid,'\n');
fprintf(fid,' %s%s%s\n',Label_1,Label_2,Label_3);
for ii = 1:6
fprintf(fid,'%5s: ',Mo_2 {ii});
fprintf(fid,'%5.2f,%5.2f,%5.2f\n',Data_2(ii,:));
end
fclose(fid);

二进制文件操作

在更多的时候，使用二进制 (binary) 文件进行文件存储和读取具有更高的效率。

下面就给出操作二进制的例子来看看 MATLAB 是如何存取二进制文件的。

1
2
3
4
5
6
7
8
9


function A = read_bin_file(filename,data_type)
fid = fopen(filename,'r');
if fid < 0
error('error opening file %s\n',filename);
end
A = fread(fid,inf,data_type);
fclose(fid);

下面是写入二进制文件

1
2
3
4
5
6
7
8
9


function write_array_bin(A,filename)
fid = fopen(filename,'w+');
if fid < 0
error('error opening file %s\n', filename);
end
fwrite(fid,A,'double');
fclose(fid);

小结： MATLAB 提供了对常用文件类型操作的支持，使用文件，我们可以更方便地读入大量数据并进行操作，同时输出易于阅读的数据。

我与科比的八年光阴

Thu, 14 Apr 2016 12:16:55 +0000

碎碎语：本文写于 2016 年科比退役之战当天夜晚，4 年之后的 2020 年我在简书的草稿箱中发现了这篇未发布的文章，也是在 2020 年的 1 月 26 日，科比因直升机事故意外离开了，唏嘘不已。Mamba Out，感谢有你的篮球世界。

初识科比

08 年，还在上小学的我，回家打开电视，中央 5 台正在播 07-08 赛季总决赛湖人对阵凯尔特人的比赛。那是我第一次看 NBA 总决赛，此前从不关心篮球的我饶有兴致地来看这场比赛。因为，这是总决赛第六场，凯尔特人已经遥遥领先，我即将见证一个冠军的诞生。这场比赛，是我真正意义上看科比的第一场比赛。当然，这场比赛的结局也是我们都知道的，湖人以 92:132 大比分落败，绿军三巨头如愿以偿的拿到了属于他们的总冠军。依稀记得从下半场开始，胜利的天平就完全倾倒在凯尔特人一边：一边是凯尔特人完美的配合、现场观众一阵又一阵的 “Beat LA”；另一边是科比孤胆英雄般无奈的单打、罚球时被观众的嘘声，一切的一切仿佛注定了这个比赛不属于科比、这个冠军不属于湖人。绿军的团队配合、湖人的溃不成军使我体会到篮球的魅力——篮球不属于个人，篮球属于团队。相信大家都还记得最后还有几分钟时，皮尔斯将饮料倒在教练里弗斯身上的那一幕。这一场比赛，使我彻底爱上了篮球。这一场比赛，科比在。

憎恶科比

那一次的总决赛给我留下的印象：科比太独，这样的人不配有冠军。08-09 赛季，我正式关注 NBA。那时的联盟，有姚明、有火箭。和许许多多人一样，我也有着主队情结。那一年火箭艰难突围，杀入季后赛第二轮，对手便是洛杉矶湖人队。很明显，这不是势均力敌的比赛，然而火箭还是艰难杀入抢七大战。败给湖人，无悔。科比在的湖人，无情的将我喜爱的球队淘汰。我讨厌湖人，讨厌科比。年轻的魔术在爆冷击败骑士之后，艰难杀入总决赛。彼时的的魔术，有年轻的霍华德，还有特科格鲁、刘易斯等一批角色球员。然而湖人的阵容，更加恐怖，内线有正值当打之年的加索尔和拜纳姆。面对年轻的魔术，他们毫不手软，4:1 的屠杀。我不情愿，但科比拿到了他的第四个总冠军。

尊敬科比

随后一年的 09-10 赛季，是属于科比的一个赛季。我在电视机前见证了科比 0.5 秒超远三分绝杀热火，记忆犹新。我没有惊叫，而是愣住了半天，完全无法相信自己的眼睛。但科比就是科比，他做到了。我在了解到他曾经种种：3 连冠、81 分……之后，我已不敢想象这个男人有多强大。当年的总决赛，湖人和凯尔特人再一次会师总决赛。我很希望凯尔特人再赢一次。毕竟岁月无情，当年的三巨头已是迟暮，这或许是他们最后一次杀入总决赛。抢七大战正好在周末，我静候着一个冠军的诞生。然而这次还是湖人，艰难的赢下了比赛。第五冠，已是科比的囊中之物。绿军，也该谢幕了。我慢慢意识到，这是属于科比的时代，这是属于他的冠军。

热爱科比

这种热爱，我想，更多的是对篮球本身的热爱。我相信对于很多人来说，科比就是篮球的代名词。他做到的几乎就是这项运动不可思议的一切：美如画的后仰跳投、暴力的扣篮、惊天的绝杀、不断打破的记录、一个又一个的冠军……凡是我所能想到的关于这项运动的一切，都有他的存在。看他的比赛，成为一种欣赏，他也让篮球成为一种欣赏。然而，英雄终有迟暮。大大小小的伤病，还是把这位铁人给摧垮了。不知从哪日起，科比不再是我们熟悉的那个科比，他不再无所不能：数据下滑、投篮打铁。 12-13 赛季，湖人引进霍华德和纳什，组成新的豪华阵容。本以为湖人又将迎来新的王朝，结果却令人大失所望。那个赛季，随着霍华德的报销，科比扛起了整支球队。强烈的求生欲让他多场高强度比赛。最终在 13 年跟腱撕裂，这是危及职业生涯的伤病。很多人质疑他会不会就此退役。他用行动诠释了什么是真正的坚韧。然而 13-14 赛季，科比在打了 6 场比赛之后，再次受伤，赛季报销。14-15 赛季，科比强行突破暴扣拉伤肩膀，导致右肩旋转袖肌腱撕裂，赛季报销。那两年，科比淡出了我们的视线。我们也见证了一批新兴球队和球星的成长。 15-16 赛季，科比归来。然而，37 岁的科比已经不是当年的小飞侠。自己的身体、湖人的糟糕战绩也让他没了斗志。一个人可以被毁灭，但不可以被打败。科比败给了时间，败给了伤病。 20 年了，也该歇歇了。这一年，我大一。 96 黄金一代，也终于谢幕。沧海桑田，8 年的时光，送走了他们：艾佛森、纳什、雷阿伦、佩贾、费舍尔、华莱士……

最后一战，60 分。拼尽全力，昔日的黑曼巴仿佛又回来了。然而这却是最后一次了。

告别科比

科比陪伴我从小学到大学，整整 8 年，有些人甚至更长。他是引领我进入篮球时间的那些人之一。我从讨厌科比到喜欢科比。8 年时光，是回不去的青春。篮球教会我很多，科比也教会我很多。他的好胜心、野心、领袖气质，还有他的刻苦、坚韧以及对篮球的热爱，是我们永远所不能忘怀的。

Farewell, Kobe. Thank you.

N 阶行列式算法

Sun, 01 Nov 2015 09:46:23 +0000

那时，线性代数刚学到行列式。突然有种冲动想做个行列式计算器。于是就有了下面这个 N 阶行列式计算器。(●—●)

思路

其实用的是最简单的方式: 按行列式的第一行展开。算法用的是递归。说的简单的点，类似数列的递推。如果: N 阶行列式的值是 a(N)，那么按照第一行展开，会得到余子式，而余子式是 N-1 阶的行列式，那么可以记为 a(N-1)，其计算方法是和计算 a(N) 一样的。所以可以构造一个函数 f ，计算 f(n) 要用到 f(n-1) ，同理一直推下去，直到 f(2) 是一个固定的值。这个值会返回代入 f(3) 并计算出 f(3) 的值，如此直到计算出 f(n) 的值。

使用工具

开发工具: Visual Studio 2015
开发语言: C#

下面贴出核心代码

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19


public double[,] cofactor(double[,] x, int n, int a)
{
double[,] result = new double[n - 1, n - 1];
for (int j = 0; j < a; j++)
{
for (int i = 1; i < n; i++)
{
result[i - 1, j] = x[i, j];
}
}
for (int j = a + 1; j < n; j++)
{
for (int i = 1; i < n; i++)
{
result[i - 1, j - 1] = x[i, j];
}
}
return result;
}

以上是求一个余子式的函数。最终返回 n-1 阶数组的结果。其中第一行的参数中：x 为原矩阵，n 为阶数，a 为按第一行展开到了第几个数。下面是求行列式的函数，调用到了 Pow (求幂) 和上面的求余子式的函数。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17


public double det(double[,] x, int n)
{
double result = 0;
if (n == 2)
{
return x[0, 0] * x[1, 1] - x[0, 1] * x[1, 0];
}
else
{
for (int i = 0; i < n; i++)
{
// 按第一行展开，降阶算
 result = result + x[0, i] * Math.Pow(-1, i) * det(cofactor(x, n, i), n - 1);
}
return result;
}
}

再加上输入和输出，就是一个完整的行列式计算器。代码并不长，也没用到什么高级的东西。仅供参考，欢迎指出问题。

原文最初发布于简书

UWP 自定义锁屏 & 桌面壁纸

Sat, 31 Oct 2015 12:16:55 +0000

调用通用的 API 来设置桌面壁纸，可以实现很多有趣的功能。在 Windows 通用平台中，可以使 Windows.System.UserProfile 命名空间下的类 UserProfilePersonalizationSettings 来对系统的开始界面背景和锁屏壁纸进行操作。它可以修改锁屏壁纸和桌面壁纸，调用后会返回bool值，如果成功就是 true，否则返回 false。在调用 UserProfilePersonalizationSettings 类前，先访问一下 IsSupported 方法，看看是否支持该操作。然后通过 Current 属性可以获取到一个 UserProfilePersonalizationSettings 实例，之后你就可以设置壁纸了。调用 TrySetLockScreenImageAsync 方法设置锁屏壁纸，调用 TrySetWallpaperImageAsync 方法可以设置桌面壁纸，参数都是用来作为背景的图片文件的 StorageFile。

下面通过实例来演示一下如何实现这个功能。

因为 UserProfilePersonalizationSettings 被封装在 Windows.System.UserProfile 中，先引用

1

using Windows.System.UserProfile

设置壁纸

1
2
3
4


UserProfilePersonalizationSettings setting
= UserProfilePersonalizationSettings.Current;
// 实例化对象
bool b = await setting.TrySetLockScreenImageAsync(file);

其中 TrySetLockScreenImageAsync(file) 是尝试设置文件对象 file 为锁屏壁纸。

在测试中，我是直接在项目根目录下添加了一个 pic.jpg 的 1280*720 的图片文件。（其实应该放 Assets 里面的）

那么如何导入图片文件呢？需要用到 StorageFile 和 Uri 在 Class 下定义：

1

private static Uri imgUri = new Uri("ms-appx:///pic.jpg");

这样就有个 Uri 指向根目录下的 pic.jpg 文件。接下来要用到 StorageFile 来导入文件。还是要先引用

1

using Windows.Storage;

从 imgUri 导入文件，注意要用到异步

1

StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(imgUri);

下面贴上主要源码。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private static Uri imgUri = new Uri("ms-appx:///pic.jpg");
private async void button_Click(object sender, RoutedEventArgs e)
{
var msg = new MessageDialog("");
if (!UserProfilePersonalizationSettings.IsSupported())
{
var mess = new MessageDialog("人品太差，不支持哦！");
await mess.ShowAsync();
}
// 获取文件
 StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(imgUri);
// 设置背景
 UserProfilePersonalizationSettings setting = UserProfilePersonalizationSettings.Current;
bool b = await setting.TrySetLockScreenImageAsync(file);
}
}

©Fing

原文最初发布于 https://www.jianshu.com/p/ee4ceeb8abda

C 语言入门那些事

Fri, 23 Oct 2015 14:49:49 +0000

刚开始上 C 语言课的同学都有哪些困惑呢？这里来为你解答，从开发环境的选择到学习资料等～

C 语言开发环境选择

都有哪些开发环境？

很多很多： =￣ω￣=

Visual C++（6.0；2010 Express）

Visual Studio （2013；2015）

Dev C++（5.11）

C-Free

Xcode（Mac 上的）

Vim+GCC+GDB（Linux 上）

......

该用哪个？？

Visual C++（简称 VC++），教学用的比较多的有 6.0 和 2010。 VC++6.0 是 1998 年发布的，古董级。 Visual C++2010 Express，即学习版，是免费的。教材上用的也是这个版本。VC++2010 包含在 Visual Studio 2010 中，安装包体积较大 (1.8G)，首选推荐的还是这个。
Visual Studio（简称 VS），2013 和 2015 版本非常的新，也是免费的，安装包体积更大 (3~4G)，对电脑性能要求也比较高。没事的话还是别装这个。（装了就算了，用起来和 VC++2010 差不多）
Dev C++，非常适合新手的开发环境。安装包体积不到 50M，轻量级。功能上和 VC++2010 是差不多的。而且创建项目也不像 VC 那么繁琐。
Xcode，买不起 Mac （债见）
Vim+GCC+GDB，Linux 下的。虽然很好用，但非常不适合新手。

VC++ 2010 Express (学习版) 下载及安装

官方中文版下载地址 (点我) 下载好了之后是一个 1.76G 的 iso (光盘映像) 文件。Win8 及 Win10 的同学可以直接双击挂载，然后运行 setup 安装。 Win7 的同学需要一个映像挂载工具，具体私戳我吧。运行安装程序后：选择第三个。然后一直下一步，直到安装完成。 完成后，到开始菜单里面去找这货！！ 就可以运行啦！然后参考实验与习题那本书，敲代码！

Dev C++ 下载与安装

下载地址 (点我) 这个的安装就快多了，下载完成后解压，运行 Dev-Cpp.5.11.exe 首先选择 安装过程中的语言，默认 English 就可以了，然后一直 Next，安装就完成了。点开桌面的图标，第一次运行会有设置中文的选项。然后 Next, 就可以新建文件了。F11 编译并运行。

Dev C++ 真的挺好用的，没有 VS 那样臃肿，简单轻快。（我都不舍得卸载）

不过鉴于教材，还是首推 VC++2010。有任何问题欢迎提问。

C 语言书籍推荐

那么有哪些 C 语言的书籍呢？公认的比较经典的是《C Primer Plus》，当然也有《C Programming Language》，中文名叫《C 程序设计语言》。

还有一些网上的视频课程也都很好。

Linux 下 C 语言起步

相比于 Windows 平台，Linux 下的开发环境搭建可以说是非常简单，或者说是 根本不需要搭建！！在众多的 Linux 发行版本中，都自带了 gcc 编译器、被誉为编辑器之神的 vim。下面就已 Linux 的一个发行版：Ubuntu 平台来举例如何轻松完成 helloworld！首先，你得有 Ubuntu... 否则下面都是扯淡。快捷键 Ctrl+Alt+T 打开终端（就是给你输入指令的地方）。黑底白字，看起来高大上。输入 vim hello.c 意思是用 vim 新建并打开 hello.c 从最下面可以看出，vim 打开了 hello.c 的新文件。接下来按 i 进入编辑模式。把熟悉的 helloworld 敲进去。接下来按 Esc 进入 vim 的命令模式，输入 :wq，意为保存并退出。返回之前的终端界面。输入 gcc hello.c 编译 hello.c ，默认生成了 a.out 的可执行文件。输入 ./a.out 运行 a.out Bingo! 成功！

C# 实现图片马赛克

Fri, 04 Sep 2015 19:40:38 +0000

如何使用 C# 实现图片的马赛克算法呢？本文带你来一探究竟……

原文同步发布在简书本图片马赛克问题来自于 WHUMSC2015 年招新

说到马赛克，大家一定不陌生。但是该如何利用编程语言实现呢？使用工具：

C#
Visual Studio 2015 Community
Windows 10

原理：大家都知道，一张图片是由一个一个像素组成。这些像素呢逐次排列，就好像方格纸一样。(密集恐惧症慎入) 每个格子都是一个特定的颜色。那么怎么实现马赛克呢？说白了呢，就是实现下面的一个转换（每个字母代表一个像素，假设马赛克的范围为 2）：间隔选取像素点（如 ACE...），接着填充至周围的格子中。实战：首先要用到 System.Drawing 一般创建 Win 窗口程序时都已经引用了。我们要用到里面的 Bitmap 库类来进行图片的读取和写入操作。构造一个函数

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23


// img为输入的图像，a为马赛克的范围
public static Bitmap imgMosaic(Bitmap img, int a)
{
// 两层循环，遍历每一个间隔的像素点
 for (int h = 0; h < img.Height; h += a)
{
for (int w = 0; w < img.Width; w += a)
{
// 获取颜色
 Color xxx = img.GetPixel(w, h);
// 另一层循环，填充颜色
 for (int x = w; (x < w + a && x < img.Width); x++)
{
for (int y = h; (y < h + a && y < img.Height); y++)
{
img.SetPixel(x, y, xxx);
}
}
}
}
return img;
}

至于效果么。。你们自己感受一下：其实挺好了，已经有马赛克的效果了。我又想：怎么让马赛克的效果更好呢？问题是 ACE 这样的像素可能不能代表周围的一圈像素。于是，我们可以取 ABGH 的 RGB 平均值再填入这些像素中。代码如下

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34


public static Bitmap imgMosaic2(Bitmap img, int a)
{
for (int h = 0; h < img.Height; h += a)
{
for (int w = 0; w < img.Width; w += a)
{
int avgR = 0, avgG = 0, avgB = 0;
int count = 0;
for (int x = w; (x < w + a && x < img.Width); x++)
{
for (int y = h; (y < h + a && y < img.Height); y++)
{
Color pix = img.GetPixel(x, y);
avgR += pix.R;
avgG += pix.G;
avgB += pix.B;
count++;
}
}
avgR = avgR / count;
avgG = avgG / count;
avgB = avgB / count;
for (int x = w; (x < w + a && x < img.Width); x++)
{
for (int y = h; (y < h + a && y < img.Height); y++)
{
Color newColor = Color.FromArgb(avgR, avgG, avgB);
img.SetPixel(x, y, newColor);
}
}
}
}
return img;
}

再来感受一下效果：瞬间感觉好多了。

至于导入图片：

1

image1 = new Bitmap(@"C:\img.jpg", true); // @后换成自己想要的路径就可以了

建站（折腾）日志

Tue, 01 Sep 2015 13:09:56 +0000

其实这是一篇最新的文章 23333 记录一下折腾的历史～

写在前面

生命不息，折腾不止。

折腾经历

2020 年 6 月

迁移到 Hugo，采用主题 MemE

2020 年 5 月

迁移回 Hexo，更改主题为 Cactus。

2020 年 1 月

从 Hexo 迁移到 Google Blogger (Blogspot)

2019 年 1 月

博客源文件托管从 Bitbucket 迁移至 GitHub 私有仓库。

2018 年 4 月

更改博客到子域名 blog.imfing.com，采用 https。域名改用 Cloudflare 解析和提供 CDN 加速（虽然在国内依旧很慢）。因为 SSL 问题放弃原服务器，改用 Netlify 托管和自动构建静态网页，由 Bitbucket 托管本站原始文件。

2017 年 12 月

更换域名为顶级域名 imfing.com。服务器由国内腾讯云迁到国外 Vultr（US New York）。旧域名 fingr8.cn 将会自动跳转到新的域名。

2017 年 11 月

从 Wordpress 转到 Hexo，使用主题 NexT，托管在 Github Pages 上。因 Github Pages 有限制，速度不稳定，故考虑换自己的 VPS 托管。

2017 年 4 月

因为 Grav 相对小众，便考虑使用更加成熟的 WordPress 来。从 Grav 迁移到 WordPress，找到了一个挺不错的主题 Kratos。完成了域名 fingr8.cn 的备案。

2017 年 1 月

最初因看到一个开源的 CMS（内容管理系统）而萌生自己搭建（折腾）一个博客的想法。故最开始使用 Grav 搭建。部署于腾讯云的学生主机上，使用腾讯云注册的学生免费域名 fingr8.cn Grav 是基于 PHP 的扁平 CMS，即不需要依赖数据库，部署非常便捷。当然，在此过程中也看到过很多其它的类似博客框架，比如 Typecho，GitBlog。 Grav 的官方文档非常清晰。在折腾 Grav 的过程中也学到了不少网站的知识，比如 Apache 的配置，PHP、模板引擎、前端等等。不满足 Grav 提供的主题，自己写了一个基于 Material Design 的主题，至今保留在 grav.fingr8.cn。也一直希望把它贡献到官方主题库去，然而一直搁置了。

2016 及以前

尝试过 CSDN、博客园、Leanote，到后来的简书(也是我发布文章最多的地方，现在太杂乱了)。作为一个爱技术（折腾）的人，当然得搞一个自己的网站了。