bouzuya.hatenablog.com

ぼうずやのにっき

bouzuya/fake-history-fns をつくった

bouzuya/fake-history-fns をつくった。

fake-history-fns は bouzuya/fake-history (2017-04-01) の class を使わない版。 fake-history は History interface を備えた fake object である 。特徴というか利点は次のとおり。

  • 関数単位での import ができる
  • JSON.stringify / JSON.parse で serialize / deserialize できる
  • (個人的に) OOP は難しいので FP (?)

README にある例。

import * as assert from 'assert';
import {
  back,
  create,
  current,
  currentState,
  length,
  next,
  nextState,
  previous,
  previousState,
  pushState,
  state
} from 'fake-history-fns';

const p0 = create();
const p1 = pushState(p0, 1, '1', '/1');
const p2 = pushState(p1, 2, '2', '/2');
const p3 = pushState(p2, 3, '3', '/3');
const b1 = back(p0);

assert(length(b1) === 3);
assert(state(b1) === 2);

assert(current(b1) === '/2');
assert(currentState(b1) === 2);
assert(next(b1) === '/3');
assert(nextState(b1) === 3);
assert(previous(b1) === '/1');
assert(previousState(b1) === 1);

bouzuya/mr-jums には fake-history でなく fake-history-fns を採用した。実際には関数単位での import なんてしないし、 History を永続化する意味はまったくないので、趣味の問題だ。

2017-W13 ふりかえり

2017-W13 をふりかえる。

2017-03 の目標

  • ☐: 『型システム入門』を読む
  • ☑: 斑鳩を続ける
  • ☑: bath 2.0.0 をつくる
  • ☐: PureScript でなにかつくる

2017-04 の目標

2017-W13 の目標

  • ☑ 斑鳩をクリアしたことを書く
  • ☑ 3 月のふりかえりを書く
  • ☑ rev-hash のことを書く
  • ☑ mr-jums に bath 2.x を適用する

すべての今週の目標を達成できた。ひさしぶりだ。……とは言え、「〜を書く」以外の項目である bath の mr-jums 適用は 2017-03-05 から引き伸ばしてきたものなので、いまさらではある。

今週の記事

つくったもの

2017-03-27/2017-04-02

今週の目標にもあった mr-jums の bath 適用のほか、新たにつくった fake-history-fns も適用している。 fake-history-fns のほうは既存の形が悪く、あまりうまく適用できていないのだけど……。

何にせよ、今年の目標にも含めた「自分の使うものはできるだけ自分でつくる」にもあっているし、「なるべくはやく見えるもの・かたちあるものにする」のようにかたちのあるものをつくれている。良い傾向だ。

来週は諸事情により Android の開発について調べていくつもりだ。

その他

2017-03 ふりかえりにも書いた (2017-03-31) が、斑鳩をクリア (2017-03-27) し、今年の目標をひとつ達成した。

『プログラミング言語の基礎概念』を読んでいる。いまの調子で進めば来週には読み終わるだろう。

姪っ子および妻へのプレゼントとして、椅子と収納ケースを買った。忘れそうなので書いておく。

2017-W14 の目標

bouzuya/fake-history をつくった

bouzuya/fake-history をつくった。

fake-history は History interface を備えた fake object だ。

次は README から引用した例。

import * as assert from 'assert';
import { FakeHistory } from 'fake-history';

const history = new FakeHistory();
history.pushState(1, '1', '/1');
history.pushState(2, '2', '/2');
history.pushState(3, '3', '/3');
history.back();

assert(history.length === 3);
assert(history.state === 2);

// extended
assert(history.current === '/2');
assert(history.currentState === 2);
assert(history.next === '/3');
assert(history.nextState === 3);
assert(history.previous === '/1');
assert(history.previousState === 1);

欲しくなった理由は react-router などを使わず自前で実装していて、 Browser の History と似た挙動をする fake object が必要だったから。具体的には current や previous あるいは next などが欲しかった。それらで history.back() が可能かを判断したかった (もちろん、厳密には確認できないのだけど) 。

気が向いたら使ってみてほしい。

……で、ぼくの場合、これで要件としては問題ないはずなんだけど……。ぼくは History との互換性のために class や property を使っているのが嫌なので、 fake-history-fns をつくってそちらを使おうかと思っている。

あ、ちなみに 2017-04-01 だからといって、 fake-history は嘘じゃない。

2017-03 ふりかえり

2017-03 をふりかえる。

期間別の目標

2017 の目標

  • 自分の使うものはできるだけ自分でつくる。
  • なるべくはやく見えるもの・かたちあるものにする。
  • 納得のいくものをつくる。
  • こつこつとやる。
  • 斑鳩ノーマルをノーコンティニュークリアする。
  • 型システム入門を読む。

2017-03 の目標

  • ☐ 『型システム入門』を読む
  • ☑ 斑鳩を続ける
  • ☑ bath 2.0.0 をつくる
  • ☐ PureScript でなにかつくる

斑鳩はノーマルをノーコンティニュークリアし、 2017 年の目標を達成した。

週別のふりかえり

つくったもの

2017-03-01/2017-03-31

blog などは除外している。

DefinitelyTyped は htmlescape ではじめて PR した。 dts-gen は Error の継承の件で PR した。

mr-jums の修正が主で、 bath / spa-town / fake-history あたりが新規のはず。 bath は 2.0 になった。 fake-history についてはまだ書いていない。明日には書くつもりだ。

その他

2017-01 は病気、 2017-02 は落ち込んで、 2017-03 もあっという間に過ぎ去ってしまった。 2017-03 は斑鳩の目標を達成できた点で大きい。ひとつ区切りをつけて、次へと進めていきたい。年間目標にあるとおり「こつこつ」やろう。

読書。『型システム入門』を再開すると書きながら再開できていない。ざっと目を通すくらいはしたのだけど、ほとんど分かっていない。かわりに『プログラミング言語の基礎概念』を読んでいる (2017-03-30)。こちらは 4 月には読み終わるだろう。読めるようになるために何かを読むかたちになっている。

ゲーム。先に書いたとおり斑鳩で目標を達成した (2017-03-27) 。ほかには『スーパーマリオ ラン』が Android に来たので買った。まだ書いていない。アナログゲームは増えていない。ダンジョンオブマンダムがすこし欲しいが、ボードゲーム同好会が 2017-03 の #9 でしばらくおやすみらしいので、これを気にすこし控えめにしよう (2017-03-20) 。

その他。食洗機を買った (2017-03-18) 。半月ほど使っているが、快適だ。

2017-02 の bouzuya.net に続いて、 blog.bouzuya.net が https になった (2017-03-23) 。 mr-jums も気まぐれに開発を進めている。 https 対応の関係で使っている CloudFront (2017-03-22 etc.) や、それに関連して Heroku での Docker 利用 (2017-03-16) など、すこし環境を見直している。 Lambda の活用ももっとしたほうがいいんだろうな……。

shinosaka.hs は 2017-03 の #4 でしばらくおやすみらしい (2017-03-25) 。 Haskell と PureScript はどちらも止まってしまっている。触れていきたいけど、 Android も触らないといけないことになっていて……。 Rust ももうすこしやりたいんだった……うーん (2017-03-17) 。時間が足りない。

2017-04 の目標

『プログラミング言語の基礎概念』を読んでいる

斑鳩を終えたことで生まれた時間を『プログラミング言語の基礎概念』にあてている。

2017-03-27 に書いたとおり斑鳩をクリアした。目標を達成した。せっかくなのですべての CHAPTER をランク A 以上にするまでは続けるつもりなのだけど、いままでと同じように続けるつもりはない。かける時間としては週末にすこしだけで十分だと思っている。斑鳩に毎日あてていた時間が浮く。 1 日あたり 45 分の時間が浮くはずだ。

この時間を何にあてるべきか。

ぼくはひとまずその時間を読書にあてることにした。『プログラミング言語の基礎概念』を読んでいる。前にも一度は目を通したはずなのだけど、改めて読んでいる。もちろん、この選択は『型システム入門』からの逃げなのだが、完全に逃げたわけではない。外堀を埋めるような気持ちでいる。ちなみに『プログラミング言語の基礎概念』は『型システム入門』の監訳者序文で紹介されている。

本書の内容に特に関係が深い日本語書籍としては、五十嵐淳氏による『プログラミング言語の基礎概念』(サイエンス社、2011 年、http://www.fos.kuis.kyoto-u.ac.jp/~igarashi/CoPL/) が挙げられるだろう。帰納的定義や操作的意味論、単純型、ML 多相型、型推論およびそれらの実装についてコンパクトにまとまっており、本書のある種のダイジェスト版としても参考になると思われる。

まだ 3 章までしか読んでいない。全 10 章。 1 日 1 章を読めば、来週には終わるだろう。

mr-jums に spa-town / bath を適用した

bouzuya/mr-jums に bouzuya/spa-town (bouzuya/bath) を適用した。

もともと mr-jums は list と detail しかないので、 spa-town の効果が分からないのだけど、とりあえず。

NOTE: mr-jums の server-side

  • client-side のための初期化 (最初の描画とそれに必要な状態の作成) が仕事だ。
  • HTTP method は GET だけを考えていればいい。 HEAD / OPTION あたりはその前後で処理できる。
  • URL および header の情報から状態をつくり、それをもとに描画する。
  • URL および header からルーティングによって適切な初期化処理を選ぶ (ここが今日の spa-town / bath の領域) 。
  • view の root は server-side と client-side で異なる。
  • 描画の際には、client-side の view の root より上でも vdom を使っている。効率を考えると string にはめるほうが良いのだけど、すべて vdom のほうが気持ち良いのでそうしている。
  • 状態をつくる際には、別途 API から JSON を取得している。効率を考えるとティア分割しないほうがいいのだけど、役割ごとに明確に分離しておくほうが気持ち良いのでそうしている。
  • そもそも、将来的にはすべて pre-render して S3 に deploy で終わらせるつもりなので、効率を考えると server-side にこる意味はまったくないのだけど……。

bouzuya/mr-jums で rev-hash を使う

bouzuya/mr-jums で rev-hash を使うようにした。 2017-03-10 や 2017-03-22 に関連することを書いている。

rev-hash は 1 行で書けそうな npm package だ。 md5 で hash をとり、その hex の先頭 10 文字をとるだけのものだ。

今回はビルドしたファイルの末尾につけるために使う。キャッシュが更新されないことへの対策だ。これくらいの用途なら、短期間ではおそらく衝突しないし、これで十分だろう。

静的コンテンツを Amazon S3 に配置し CloudFront 経由で配信する。Travis CI で静的コンテンツを build & bundle & deploy する。このときにいつも同じ名前だと CloudFront などでキャッシュが効いて更新されないかもしれない。そこで別の名前で配置する。静的コンテンツを指し示す側の動的コンテンツさえ変更すれば良い。

過去の静的コンテンツも削除しなければ、過去のデプロイに切り戻すことも容易だ。静的コンテンツといっても JavaScript や CSS なら、過去のものをすべて保存しても大した容量にはならない。

問題があるとすれば development (local) と production で環境が違ってしまうことだ。がんばればできそうだが source map などいろいろ問題が出そうなので、妥協している。 webpack への依存もできれば避けたい。環境の違いについては production の前に、同じ構成の別の環境をおいて、そこで検証しておけば大きな問題は避けられるだろう。

……というわけで bouzuya/mr-jums は rev-hash を使って hash をつけている。しばらくこれで様子を見る。