読者です 読者をやめる 読者になる 読者になる

ねぇうしくんうしくん

今週のまとめ (一週間で自分が見た技術系サイトのログ)が今のところメインです。プログラミング言語、人工知能、セキュリティ 等

arXiv を見るビューアーを作った

45deg.github.io

arXivはAPIを提供しているが、 親切なことに Access-Control-Allow-Origin: * ヘッダを付けてくれている。 つまり、クロスオリジンの制約なく API にアクセスできるため、任意のドメインから XHR のみ (つまりクライアントアプリケーションのみ) で API にアクセスできる。 それに気づいたため、折角なので作ってみた。

機能としては、今のところカテゴリの選択と日付の選択だけである。要望があれば言っていただければ嬉しい。 また、arXiv自体の挙動が不安定(例えば、アナウンスタイムを過ぎてもアナウンスされない、前日のサブミッションが翌日のサブミッションに混ざっている等)なことに加え、まだ十分に動作確認していないのでバグが発生するかもしれないがご容赦願いたい。

使用した技術

Mithril.js

つい先日ver 1.0.0がリリースされたSAP向けフロントエンドライブラリ。その軽さ(ベンチマークがサイトに載ってある)とXHRが組み込まれているところが気に入って採用した。 使ってみた所感は以下の通り。

  • JSX や webpackによるモジュール分割 の連携などでかなり楽になった。APIを必要最小限にしながら、うまくモダンJSのエコシステムを利用していると思う。
  • ステート管理の自由度が高い。逆に言えば、雑に作るとひどいコードになる (若干なった)。真面目に使うなら Redux などのステート管理ライブラリを使うのが良さそう。
  • React と比べるとやはりプラクティスやリソースが少ないのが気になる (自由度が高いので尚更)。それについては時間が解決してくれるだろう。
  • 結論としては、今後もこういった小〜中規模のアプリケーションにはどんどん採用していこうと思った。

Tachyons

レスポンシブルな CSS ツールキット。Tachyonsを用いると、

div.hoge {
  margin: 1em;
  border-radius: .5rem;
  border-style: solid;
  border-width: 1px;
  padding: .5rem;
}

といった CSS

<div class="ma2 br3 ba1 pa1"></div>

と等価となる。

つまり、Tachyonsは、再利用性が高い豊富なクラス定義を組み合わせることでデザインを構築し、CSSを書く労力を減らすという思想に基づいたツールキットである。Bootstrap などにある高レベルなコンポーネント (フォームやボタンなど)は提供されていない。そういったフレームワークに比べると、 Tachyons はユーザーが自分でデザインする点において低水準であるが、自由度はかなり高いといえる。 また、モジュールの粒度がかなり細かいので必要最低限までファイルサイズの最適化が可能となる。