はい、おつカレー様です。
くわのです。
Muninという監視ソフトウェアがございます。
こちら、とても使い勝手のいい、ソフトウェアでございまして、プラグインも作りやすいし便利なものなんですが、良くないのが、「1.4だと性的静的なグラフ画像生成のコストがエラい高い」「2.0だとグラフ画像生成は動的にできるけど、画面表示時にガッツリ変換するのでめちゃくちゃ遅い」っていう問題があります。
今回その辺の問題を軽減するためにLazy Load Plugin for jQueryを組み込んでみました。
Muninについて詳しく知りたい方は@zembutsu さんのSlideShareを見ていただけるとありがたいです。
あと、Software Design1月号も詳しい記事があります。(こちらも@zembutsu さんの記事になります)
Software Design (ソフトウェア デザイン) 2012年 11月号 [雑誌]
- 出版社/メーカー: 技術評論社
- 発売日: 2012/10/18
- メディア: 雑誌
- 購入: 3人 クリック: 19回
- この商品を含むブログ (4件) を見る
というか、Muninの情報が知りたかったら@zembutsu さんをウォッチしていればよろしいwww
Lazy Load Plugin for jQueryとは
基本的に、ブラウザでWebページが読まれた時に、そこの表示される画像はすべて読み込まれます。
ただ、Munin2.0でそれをやると、前述のとおり変換が一度に走って重くなります。
そのため、画面の表示されている範囲のみの画像だけを読み込む、というのがLazy Load Plugin for jQueryです。
詳しくは公式ページをどうぞ。
組み込み手順
まずjQuery & Lazy Load Plugin for jQueryの設置
cd /opt/munin/www/docs/static wget http://www.appelsiini.net/projects/lazyload/jquery.lazyload.js wget http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js # 適当にdot.png作っておいとく # wget http://example.com/dot.png
Muninのテンプレートファイルの更新
ヘッダのテンプレートファイルのバックアップ、更新
cp /etc/munin/templates/partial/head.tmpl{,.org} vim /etc/munin/templates/partial/head.tmpl
更新内容
# diff head.tmpl.org head.tmpl 20a21,31 > <script src="<TMPL_VAR NAME="R_PATH">/static/jquery.min.js" type="text/javascript" charset="utf-8"></script> > <script src="<TMPL_VAR NAME="R_PATH">/static/jquery.lazyload.js" type="text/javascript" charset="utf-8"></script> > <script type="text/javascript" charset="utf-8"> > $(function() { > $("img").lazyload({ > effect : "fadeIn" > }); > }); > </script> > >
日時グラフ一覧画面のテンプレートファイルのバックアップ、更新
cp /etc/munin/templates/munin-comparison-day.tmpl{,.org} vim /etc/munin/templates/munin-comparison-day.tmpl
更新内容
# diff munin-comparison-day.tmpl.org munin-comparison-day.tmpl 25c25 < <img src="<TMPL_VAR NAME="CIMGDAY">" alt="<TMPL_VAR ESCAPE="HTML" NAME="LABEL">" --- > <img data-original="<TMPL_VAR NAME="CIMGDAY">" src="/munin2/static/dot.png" alt="<TMPL_VAR ESCAPE="HTML" NAME="LABEL">"
- munin-comparison-week.tmpl
- munin-comparison-month.tmpl
- munin-comparison-year.tmpl
にも同様に変更を行う。
これで完了。暫く待つか、su - munin --shell=/usr/bin/munin-cronで更新されるはずです。
効果
Lazy Load Plugin for jQueryがあるものと、ないもので比べて、Dayでの一括表示時の負荷が実行プロセス数、USRの値など下がっているのがわかります。
Lazy Loadなし時のvmstat
procs -----------memory---------- ---swap-- -----io---- --system-- -----cpu----- r b swpd free buff cache si so bi bo in cs us sy id wa st 11 0 0 26233984 182796 4588292 0 0 0 24 4253 567 91 9 0 0 0 16 0 0 26014516 182796 4588260 0 0 0 36 4210 868 92 8 0 0 0 16 0 0 25887604 182796 4588308 0 0 0 884 4217 1073 92 8 0 0 0 22 0 0 25894436 182796 4588336 0 0 0 68 4246 1109 92 8 0 0 0 22 0 0 25707196 182796 4588380 0 0 0 2140 4267 1215 92 8 0 0 0 22 0 0 25682580 182796 4588360 0 0 0 24 4151 1238 92 9 0 0 0 22 0 0 25734408 182796 4588372 0 0 0 24 4231 1235 92 8 0 0 0 22 0 0 25916616 182796 4588392 0 0 0 704 4214 1298 92 8 0 0 0 20 0 0 25757972 182796 4588396 0 0 0 24 4096 1157 91 9 0 0 0 21 0 0 25835520 182796 4588412 0 0 0 616 4267 1299 91 9 0 0 0 22 0 0 25787280 182796 4588408 0 0 0 24 4152 1229 92 8 0 0 0 22 0 0 25688576 182796 4588440 0 0 0 12 4158 1209 91 9 0 0 0 22 0 0 25703704 182796 4588464 0 0 0 620 4269 1324 91 10 0 0 0 22 0 0 25777548 182796 4588468 0 0 0 24 4234 1338 91 9 0 0 0 22 0 0 25701164 182796 4588468 0 0 0 28 4138 1233 91 9 0 0 0 22 0 0 25700544 182796 4588476 0 0 0 12 4248 1175 92 8 0 0 0 22 0 0 25950576 182796 4588500 0 0 0 12 4218 1302 91 9 0 0 0 22 0 0 25692216 182796 4588528 0 0 0 696 4132 1158 92 8 0 0 0 22 0 0 25730104 182796 4588548 0 0 0 24 4266 1247 92 8 0 0 0 22 0 0 25738968 182796 4588560 0 0 0 24 4146 1210 91 9 0 0 0 (snip)
Lazy Loadあり時のvmstat
procs -----------memory---------- ---swap-- -----io---- --system-- -----cpu----- r b swpd free buff cache si so bi bo in cs us sy id wa st 4 2 0 26504208 183016 4624264 0 0 0 3488 3263 952 30 5 26 38 0 4 0 0 26510788 183016 4624224 0 0 0 4260 5086 1298 61 11 13 15 0 7 0 0 26521420 183016 4624236 0 0 0 428 4687 1329 62 6 33 0 0 2 0 0 26561380 183016 4624228 0 0 0 488 5639 1369 89 6 5 0 0 2 1 0 26496200 183016 4624208 0 0 0 2348 3315 756 51 4 45 0 0 2 0 0 26587484 183016 4624240 0 0 0 608 3902 1062 52 3 45 0 0 2 1 0 26591700 183016 4624244 0 0 0 3004 4456 1174 57 3 34 6 0 6 3 0 26543308 183016 4624264 0 0 0 8080 4062 1136 31 8 39 23 0 2 1 0 26577060 183016 4624312 0 0 0 5640 4028 1035 48 10 19 24 0 1 1 0 26585724 183016 4624296 0 0 16 5836 5069 991 74 6 9 11 0 1 2 0 26568200 183016 4624280 0 0 0 6268 3157 834 27 3 40 29 0 4 2 0 26539744 183016 4624300 0 0 0 6316 3558 799 40 2 27 30 0 6 1 0 26317436 183016 4624296 0 0 0 6760 4136 606 62 6 21 11 0 1 3 0 26527636 183016 4624280 0 0 0 4192 2888 499 46 5 28 21 0 1 2 0 26562752 183016 4624304 0 0 0 4880 2920 730 32 2 30 36 0 7 2 0 26575960 183016 4624324 0 0 40 6708 3391 841 31 2 32 35 0 3 1 0 26498768 183016 4624696 0 0 336 9692 4706 1006 67 5 15 13 0 2 0 0 26590476 183016 4625060 0 0 476 604 3179 1166 43 2 51 4 0 12 0 0 26278588 183016 4625732 0 0 592 1320 4674 1609 76 6 17 1 0 2 0 0 26504304 183016 4626052 0 0 272 248 5120 1390 91 8 1 0 0 2 0 0 26541200 183016 4626244 0 0 188 708 3616 1219 47 2 50 1 0 (snip)
まーまーいい。
画像が一度に出ない、というデメリットもありますが、表示されないよりは全然良いので多く表示されている環境では使えるかなと思います。
- 作者: トーベ・ヤンソン,山室静
- 出版社/メーカー: 講談社
- 発売日: 2011/04/15
- メディア: 文庫
- 購入: 1人 クリック: 30回
- この商品を含むブログ (16件) を見る
Software Design (ソフトウェア デザイン) 2012年 11月号 [雑誌]
- 出版社/メーカー: 技術評論社
- 発売日: 2012/10/18
- メディア: 雑誌
- 購入: 3人 クリック: 19回
- この商品を含むブログ (4件) を見る