サイトマスターがJavaScriptの勉強のために作成したサンプルを公開します。
JavaVMのヒープサイズの内訳を計算し、グラフ化する題材で、各種JavaScriptのライブラリを組み合わせて実装します。以下のライブラリを組み合わせて実装します。
具体的には、GoogleChartsを使用して、棒グラフを使ってNew/Old、Eden/Survivor等をわかりやすく可視化する、といった題材です。※単純な計算ですが、実機で起動した場合いに実際に確保されるサイズとは若干ずれます。
どのサンプルも見た目、動作ともに全く同じですが、中身が違います。
| # | 説明 | JQuery | Bootstrap | GoogleCharts | Spine | RequireJS |
|---|---|---|---|---|---|---|
| 1 | jQuery,Bootstrap,Google Chartをただ組み合わせてグラフを表示 | 使用 | 使用 | 使用 | - | - |
| 2 | Spineを使用して、１のコードをクライアントサイドMVCでリファクタリング | 使用 | 使用 | 使用 | 使用 | - |
| 3 | 2のコードを使用して、とりあえずRequireJSをそのまま導入（コードの分割無し） | 使用 | 使用 | 使用 | 使用 | 使用 |
| 4 | 3のコードを、RequireJSを使ってモジュール分割 | 使用 | 使用 | 使用 | 使用 | 使用 |