月度归档：2018年10月

电影开屏广告

我进电影院的次数屈指可数，上一次进电影院还是几年前，印象中那时进去就是直接看电影。没想到最近去电影院，还没到点，于是看了好一会广告，这是常见经营模式了吗？

Git 永久移除文件

Git 基于内容寻址的文件系统及数据对象¹等设计，默认情况下，文件每次变更都生成一个副本。如果需要移除已经 push 到远程仓库中的文件，那么仅当前 commit 删除 ignore 并不能完全地移除掉对应的文件，还需要把其从所有的历史记录中移除才行。

这个需求可以通过 git filter-branch 来完成，但这个命令偏底层，具体到删除文件这个场景上，可以使用 bfg-repo-cleaner 这个工具。这个工具功能挺多的，具体参考官网文档或使用时的提示。

下面是一个删除指定目录的流程

git clone --mirror xxRepo   # 需要在 mirror 模式下操作
cd xxRepo
java -jar path/to/bfg.jar --delete-folders "{build, dist}" --no-blob-protection
git reflog expire --expire=now --all && git gc --prune=now --aggressive
git push

参考

Git 对象 ↩︎

《最简单的图形与最复杂的信息》笔记

《最简单的图形与最复杂的信息(The Wall Street Journal Guide to Information Graphics)》

最简单的图形与最复杂的信息

折线图用于连续数据，条形图用于离散数据。但当两个数据列都是条形图时（双 Y 轴的场景），可考虑把其中一个变为折线。

折线图 Lines

折线高度约占图标区域 2/3。
折线应比网格线粗，但不能过粗而导致掩盖了折点变化；如果有零基线，零基线应比网格线稍粗。
Y 轴增量常用 1、2、5、10、15、20、25 等。
线条应在四条以下；使用实线，通过粗细、颜色比形状区分更好（使用颜色时需要考虑色盲的情况）；如果数据系列比较多，可考虑由一个个的单折线图组成图表组。
空间紧凑且交叉点多时，可使用图例，且顺序尽量和重点顺序一致。否则可直接在折线上标注，标注应简短。
双 Y 轴应用于表示两组数据有关联的场景。
继续阅读 →

c君不在

2018/10/07

React 的行内条件渲染（inline conditional rendering）能够在无 else 分支的情况下简化条件渲染，这是由子元素定义及渲染决定的。

const ele = (
  <div>
    <p>{true}</p>
    <p>{true && 1}</p>

    <p>{false}</p>
    <p>{false && 2}</p>
  </div>
);

对应的 JavaScript 代码是

const ele = React.createElement(
  "div",
  null,
  React.createElement("p", null, true),
  React.createElement("p", null, true && 1),
  React.createElement("p", null, false),
  React.createElement("p", null, false && 2)
);

把 true && 1 等的表达式结果作为子元素去渲染时，使用 ChildReconciler#createChild ，其中仅当子元素类型（typeof）是 string、number、object 且不为 null 时才渲染，所以 true / false 则不会渲染。

继续阅读 →