Skip to content

Overview

Jump to bottom Edit New page
uupaa edited this page Oct 13, 2014 · 15 revisions

このエントリでは WebModule の概要を説明します

WebModule は、以下の要素から構成されています。

  1. WebModulePattern をベースとした、どこでも動作するコードを書く下地を提供します
  2. ClosureCompiler と連携し、実行速度とバイナリサイズを両立する仕組みを提供します
  3. Node.js, Browser, WebWorkers の各環境で一斉にテストする仕組みを提供します
  4. JSHint や Plato と連携し、コードの品質を改善し維持するための仕組みを提供します
  5. ブラウザの DevTools と、GitHub/wiki(Markdown) を連携させるオンラインリファレンスを提供します
  6. ソースコードとドキュメントを分離し、ドキュメントを拡充するための仕組みを提供します
  7. モジュールの管理とエコシステム化のためのワークフローを提供します

WebModule コードパターンをベースとした、どこでも動作するコードを書く下地を提供します

WebModulePattern は新しいモジュールの設計パターンです。

WebModulePatternに沿ってコードを生成することで、
Node.js, Browser, WebWorkers などのあらゆる環境で動作する部品を記述できます。

Closure Compiler と連携し、実行速度とバイナリサイズを両立する仕組みを提供します

WebModule は、ClosureCompiler (Compile.js) でコンパイルを行い、
コードの短縮、難読化と、不要なコードの除去やインライン展開を行います( @keyword の除去は Minify.js の機能です )。

開発中は $ npm run build でテストを行い、
リリース時は、$ npm run build-release で依存モジュールを結合した状態でビルドします。

Node.js, Browser, WebWorkers, Travis-CI の各環境で一斉にテストする仕組みを提供します

$ npm run test を行う事で、Node.js, Browser, WebWorkers の環境で、コンパイル前のコードと、コンパイル後のコードについてテストを行います。

本来は手動で十分にテストを行ってからコミットを行うはずですが、
壊れたコードをコミットしてしまう場合や、
テストをパスしないコードをコミットしてしまうケースもありえます。
そのような場合は、Travis-CI がエラーをメールで報告してくれます。

このように、手動テスト + 自動テストの仕組みを備えることで、安心して開発を進める事ができます。

JSHint や Plato と連携し、コードの品質を改善し維持するための仕組みを提供します

$ npm run lint で、コードのカバレッジ(静的解析)を行い、解析結果とこれまでの履歴をグラフで表示します。

コードの複雑度を測定し、問題のある箇所を指摘します。将来問題が起きそうな箇所も表示します。

ブラウザの DevTools と、GitHub/wiki(Markdown) を連携させるオンラインリファレンスを提供します

Help.js を読み込んだ状態のブラウザで DevTools を開き、ブラウザのコンソールで 関数名.help や Help("関数名") とタイプすることで、 オンラインリファレンスページへのリンクを表示します。

また同時に、関数を文字列として表示し、引数や戻り値の型情報をクイックに確認することができます。

> MyExample.help

  function MyExample(value) { // @arg Number: the value.
      this._value = value;
  }

  GitHub repository:
      https://github.com/uupaa/MyExample.js
  GitHub wiki page:
      https://github.com/uupaa/MyExample.js/wiki/MyExample
  Google.search( MyExample ):
      http://www.google.com/search?lr=lang_ja&ie=UTF-8&oe=UTF-8&q=MyExample

ソースコードとドキュメントを分離し、ドキュメントを拡充するための仕組みを提供します

オンラインリファレンスにより、ソースコードの記述とドキュメントの記述タイミングを分離し、ドキュメントを拡充するための仕組みを提供します。

WebModulePattern をベースにしたモジュールは、とある理由 で JavaDoc スタイルのコメントシステムを推奨していません。
ソースコード内には詳細にコメントを書かず、残すべき情報は、GitHub/wiki に記述するようにします。

詳しくは、https://github.com/uupaa/Help.js/wiki/Help を参照してください。

モジュールの管理とエコシステム化のためのワークフローを提供します

ここまでの事をまとめます。

  • WebModule をベースに作業を進めると、色々とお得です
    • 雛形(WebModuleコードパターン)があるため、モジュールの書き方でアレコレ迷う時間が不要になる
    • どこでも動作するコードを書ける
    • 実行速度とバイナリサイズを両立したコードを記述する下地が備わっている
    • テストの為の環境が備わっており、テストが可能なようにモジュールを設計することを強制される
    • カバレッジ環境が最初から備わっており、デグレードが可視化される
    • オンラインリファレンス(ドキュメント)を書くための環境が最初から備わっている
    • GitHub/wiki, Markdown によりドキュメントが外部化され、エコシステムが育ちやすい環境が備わっている

このように開発に必要な環境を一式提供することで、 コーディング作業がワークフロー化され、部品化が促進されます。

Add a custom footer

Clone this wiki locally