comparison presen/index.html @ 1:d33d9d7770b2

modify RemoteframebufferUpdate, ZRLEE
author Nobuyasu Oshiro <dimolto@cr.ie.u-ryukyu.ac.jp>
date Sat, 10 Sep 2011 03:00:41 +0900
parents d91f1fc9c123
children 149f9c8d36f5 4573aaf1bf0b
comparison
equal deleted inserted replaced
0:d91f1fc9c123 1:d33d9d7770b2
81 <h3></h3> 81 <h3></h3>
82 <li>大城 信康 谷成 雄</li> 82 <li>大城 信康 谷成 雄</li>
83 <h4><a href="http://ie.u-ryukyu.ac.jp/" rel="external">琉球大学 並列信頼研究室</a></h4> 83 <h4><a href="http://ie.u-ryukyu.ac.jp/" rel="external">琉球大学 並列信頼研究室</a></h4>
84 <div class="handout"></div> 84 <div class="handout"></div>
85 </div> 85 </div>
86 86 <!-- PAGE -->
87 87 <div class="slide">
88 <!-- PAGE --> 88 <h1>本日の内容</h1>
89 <div class="slide"> 89 <li>友人と作ったJavaによる画面共有システム「TreeVNC」について</li>
90 <h1>目的と背景</h1> 90 <li>TreeVNCを作るにあたって学んだJavaでの並列プログラミングの仕方やVNCの話</li>
91 </div>
92 <!-- PAGE -->
93 <div class="slide">
94 <h1>TreeVNCの目的と背景</h1>
91 <li>大学の講義中、スクリーンに映されている画面は後ろの席程見えずらい。 </li> 95 <li>大学の講義中、スクリーンに映されている画面は後ろの席程見えずらい。 </li>
92 <li>その問題を手元のPCにも写せるようにすることで解決しようと考えた。</li> 96 <li>その問題を手元のPCにも写せるようにすることで解決しようと考えた。</li>
93 <li class="incremental">60人以上での画面共有を行うことを目標とする。</li> 97 <li class="incremental">60人以上での画面共有を行うことを目標とする。</li>
94 </div> 98 </div>
95 <!-- PAGE --> 99 <!-- PAGE -->
96 <div class="slide"> 100 <div class="slide">
97 <h1>VNCを用いての画面共有</h1> 101 <h1>VNCによる画面共有</h1>
98 <li>画面を共有する方法 -> VNC</li> 102 <li>画面を共有する方法 -> VNC</li>
99 <li>VNC: Virtual Network Computing </br>ネットワークを介してコンピュータを遠隔操作するプログラム </li> 103 <li>VNC: Virtual Network Computing </br>ネットワークを介してコンピュータを遠隔操作するプログラム </li>
100 <li>VNCのリモートPCの画面を写す機能を利用する。</li> 104 <li>VNCのリモートPCの画面を写す機能を利用する。</li>
105 </div>
106 <!-- PAGE -->
107 <div class="slide">
108 <h1>VNCを用いての画面共有</h1>
109 <li>まず、iMacで複数のPCからVNCをかけてみた。</li>
110 <li class="incremental">-> 10台と繋ぐ前にVNCでの画面がカクカクに... </li>
111 <li class="incremental">さらにCPU使用率も跳ね上がった。</li>
101 </div> 112 </div>
102 <!-- PAGE --> 113 <!-- PAGE -->
103 <div class="slide"> 114 <div class="slide">
104 <h1>通常のVNCの問題点</h1> 115 <h1>通常のVNCの問題点</h1>
105 <table class="center"> 116 <table class="center">
113 <li><small>VNC Serverの負荷が重い。</small></li> 124 <li><small>VNC Serverの負荷が重い。</small></li>
114 <li><small>Server側の通信網1本への通信負荷が高い。</small></li> 125 <li><small>Server側の通信網1本への通信負荷が高い。</small></li>
115 </td> 126 </td>
116 </tr> 127 </tr>
117 </table> 128 </table>
129 <p class="incremental" style="text-align: center;" >実際に測ってみた</p>
118 </div> 130 </div>
119 <!-- PAGE --> 131 <!-- PAGE -->
120 <div class="slide"> 132 <div class="slide">
121 <h1>通常のVNCの問題点</h1> 133 <h1>通常のVNCの問題点</h1>
122 <p style="text-align: center;"> 134 <p style="text-align: center;">
131 <td>CPU使用率</td> 143 <td>CPU使用率</td>
132 </tr> 144 </tr>
133 145
134 <tr> 146 <tr>
135 <td>1台</td> 147 <td>1台</td>
136 <td>20M</td> 148 <td>20M<small>(最大速度)</small></td>
137 <td>55%</td> 149 <td>55%</td>
138 </tr> 150 </tr>
139 151
140 <tr> 152 <tr>
141 <td>48台</td> 153 <td>48台</td>
146 <li>VNCに使われるCPUの使用率が100%になり、スループットが5分の1まで下がっている。</li> 158 <li>VNCに使われるCPUの使用率が100%になり、スループットが5分の1まで下がっている。</li>
147 159
148 </div> 160 </div>
149 <!-- PAGE --> 161 <!-- PAGE -->
150 <div class="slide"> 162 <div class="slide">
163 <h1>通常のVNCの問題点</h1>
164 <li>サーバへのCPU負荷が高い</li>
165 <li>1本の通信網への負荷が高い</li>
166 </div>
167 <!-- PAGE -->
168 <div class="slide">
151 <h1>VNCの問題点の解決策</h1> 169 <h1>VNCの問題点の解決策</h1>
152 <p style="text-align: center;"> 170 <p style="text-align: center;">
153 <small>クライアントを木構造で接続させる</samll><br> 171 <small>クライアントを木構造で接続させるTreeVNC</samll><br>
154 <img class="scale" src="./pix/TreeVNC0.png" width="500" heigth="500"><br> 172 <img class="scale" src="./pix/TreeVNC0.png" width="500" heigth="500"><br>
155 </p> 173 </p>
156 </div> 174 </div>
157 <!-- PAGE --> 175 <!-- PAGE -->
158 <div class="slide"> 176 <div class="slide">
192 <img src="./pix/TreeVNC3.png" width="300"> 210 <img src="./pix/TreeVNC3.png" width="300">
193 </td> 211 </td>
194 </tr> 212 </tr>
195 </p> 213 </p>
196 </table> 214 </table>
197 <table class="center" border=1 cellspacing="0" width=80%> 215 <table class="center" border=1 cellspacing="0" width=100%>
198 <tr> 216 <tr>
199 <td></td> 217 <td></td>
200 <td>通常のVNC</td> 218 <td>通常のVNC</td>
201 <td>TreeVNC</td> 219 <td>TreeVNC</td>
202 </tr> 220 </tr>
203 <tr> 221 <tr>
204 <td>最大負荷</td> 222 <td>最大負荷</td>
205 <td> N * データ量 (クライアントの数に比例) </td> 223 <td> N*データ量 (クライアントの数に比例) </td>
206 <td> (M+1) * データ量</td> 224 <td> (M+1) * データ量</td>
207 </tr> 225 </tr>
208 </table> 226 </table>
209 <p style="text-align: center;"><small>クライアントの数をN、木構造の子供の数をMとする</small> </p> 227 <p style="text-align: center;"><small>クライアントの数をN、木構造の子供の数をMとする</small> </p>
210 </div> 228 </div>
211 </div> 229 </div>
212 <!-- PAGE --> 230 <!-- PAGE -->
213 <div class="slide"> 231 <div class="slide">
214 <h1>TreeVNCの設計</h1> 232 <h1>TreeVNCの設計</h1>
233 <li>木構造での接続</li>
215 <li>TreeVNCのクライアントは最初にTop Proxyに接続を行う。</li> 234 <li>TreeVNCのクライアントは最初にTop Proxyに接続を行う。</li>
216 <li>データは木の下へと流れていく。</li> 235 <li>データは木の下へと流していくようにする。</li>
217 <li>tightVNC ViewerのJava版(ver 1.3)を元にTreeVNCの実装を行う。</li> 236 <li>tightVNC ViewerのJava版(ver 1.3)を元にTreeVNCの実装を行う。</li>
218 <p style="text-align: center;"> 237 <p style="text-align: center;">
219 <img class="scale" src="./pix/TreeVNC0.png" width="500" heigth="500"> 238 <img class="scale" src="./pix/TreeVNC0.png" width="500" heigth="500">
220 </p> 239 </p>
221 </div> 240 </div>
222 <!-- PAGE --> 241 <!-- PAGE -->
223 <div class="slide"> 242 <div class="slide">
224 <h1>発表内容</h1> 243 <h1>今回の主な内容</h1>
225 <ul> 244 <ul>
226 <li>RFB Protocol</li> 245 <li>RFB Protocol</li>
227 <li>データ転送量</li> 246 <li>データ転送量</li>
228 <li>ZRLE Encodingの問題</li> 247 <li>ZRLE Encodingの問題</li>
229 <li>データ転送に用いたMulticastQueueについての説明</li> 248 <li>データ転送に用いたMulticastQueueについての説明</li>
232 </div> 251 </div>
233 <!-- PAGE --> 252 <!-- PAGE -->
234 <div class="slide"> 253 <div class="slide">
235 <h1>RFB protocol</h1> 254 <h1>RFB protocol</h1>
236 <li>Remote Frame Buffer Protocol : <br>GUI操作によるリモートアクセス用の通信プロトコル。VNCで用いられる。</li> 255 <li>Remote Frame Buffer Protocol : <br>GUI操作によるリモートアクセス用の通信プロトコル。VNCで用いられる。</li>
237 <li>転送される画面(フレームバッファ)のデータは変更があった部分(差分)だけが矩形単位で送られる。</li>
238 <table class="center" width=100%>
239 <tr>
240 <td>
241 <img src="./pix/hadesScreen1.png">
242 </td>
243 <td>
244 <img src="./pix/rightArrow.png">
245 </td>
246 <td>
247 <img src="./pix/hadesScreen2.png">
248 </td>
249 </tr>
250 </table>
251 <small>
252 <p style="text-align: center;"><font color=red>□ </font>で囲まれている矩形のデータだけが送られてくる。 </p>
253 </small>
254 </div>
255 <!-- PAGE -->
256 <div class="slide">
257 <h1>VNC のシーケンス図</h1>
258 <table class="scale" width=100% > 256 <table class="scale" width=100% >
259 <tr> 257 <tr>
260 <td width=50%> 258 <td width=50%>
261 <img class="scale" src="./pix/VNC-Sequence-.png" height=80%> 259 <img class="scale" src="./pix/VNC-Sequence-.png" height=80%>
262 </td> 260 </td>
269 </tr> 267 </tr>
270 </table> 268 </table>
271 </div> 269 </div>
272 <!-- PAGE --> 270 <!-- PAGE -->
273 <div class="slide"> 271 <div class="slide">
272 <h1>画像の更新(FramebufferUpdate)</h1>
273 <li>転送される画面(フレームバッファ)のデータは変更があった部分(差分)だけが矩形単位で送られる。</li>
274 <table class="center" width=100%>
275 <tr>
276 <td>
277 <img src="./pix/hadesScreen1.png">
278 </td>
279 <td>
280 <img src="./pix/rightArrow.png">
281 </td>
282 <td>
283 <img src="./pix/hadesScreen2.png">
284 </td>
285 </tr>
286 </table>
287 <small>
288 <p style="text-align: center;"><font color=red>□ </font>で囲まれている矩形のデータだけが送られてくる。 </p>
289 </small>
290 </div>
291 <!-- PAGE -->
292 <div class="slide">
274 <h1>RFB Protocol</h1> 293 <h1>RFB Protocol</h1>
275 <li>FramebufferUpdateRequest:</li> 294 <li>FramebufferUpdateRequest:</li>
276 <li><small>画面に差分が発生したらサーバから教えて貰うためのリクエスト</small></li> 295 <li><small>画面に差分が発生したらサーバから教えて貰うためのリクエスト</small></li>
277 <small> 296 <small>
278 <table> 297 <table width=100% style="text-align: center;">
279 <td width=50%> 298 <td width=50%>
280 <table border=1 cellspacing="0"> 299 <table border=1 cellspacing="0">
281 <tr> 300 <tr>
282 <td>バイト数</td> 301 <td>バイト数</td>
283 <td><pre>型   [値]</pre></td> 302 <td><pre>型   [値]</pre></td>
320 <td>height</td> 339 <td>height</td>
321 </tr> 340 </tr>
322 341
323 </table> 342 </table>
324 </td> 343 </td>
344 <td>
345 <img src="./pix/TreeVNC1.png" width=90%>
346 </td>
325 </table> 347 </table>
326 <li>このリクエストはTop Proxyだけが行う。 </li>
327 </small> 348 </small>
349 <li><small>このリクエストはTop Proxyだけが行う。</small> </li>
328 </div> 350 </div>
329 <!-- PAGE --> 351 <!-- PAGE -->
330 <div class="slide"> 352 <div class="slide">
331 <h1>RFB Protocol</h1> 353 <h1>RFB Protocol</h1>
332 <li>FramebufferUpdate: <small>画面の更新データ</small></li> 354 <li>FramebufferUpdateRequest:<small>画面の更新データ</small></li>
333 355 <table width="100%">
356 <td width=50%>
334 <small> 357 <small>
335 <table border=1 cellspacing="0" > 358 <table border=1 cellspacing="0" >
336 <tr> 359 <tr>
337 <td>バイト数</td> 360 <td>バイト数</td>
338 <td><pre>型   [値]</pre></td> 361 <td><pre>型   [値]</pre></td>
356 <td><pre>U16<pre></td> 379 <td><pre>U16<pre></td>
357 <td>number-of-rectangles</td> 380 <td>number-of-rectangles</td>
358 </tr> 381 </tr>
359 382
360 </table> 383 </table>
361 <li>以下number-of-rectanglesの数だけ矩形のデータが続く</li> 384 <li><small>以下number-of-rectanglesの数だけ矩形のデータが続く</small></li>
362 385
363 <table width=100%> 386 <table width=100%>
364 <td> 387 <td>
365 <table border=1 cellspacing="0" width=50%> 388 <table border=1 cellspacing="0" width=100%>
366 <tr> 389 <tr>
367 <td>バイト数</td> 390 <td>バイト数</td>
368 <td><pre>型   </pre></td> 391 <td><pre>型   </pre></td>
369 <td>説明 </td> 392 <td>説明 </td>
370 </tr> 393 </tr>
410 </td> 433 </td>
411 <td> 434 <td>
412 </td> 435 </td>
413 436
414 </table> 437 </table>
415
416
417 </small> 438 </small>
439 </td>
440 <td width>
441 <img src="./pix/TreeVNC2.png" width=90%>
442 </td>
443 </table>
444
418 </div> 445 </div>
419 <!-- PAGE --> 446 <!-- PAGE -->
420 <div class="slide"> 447 <div class="slide">
421 <h1>RFB Protocol</h1> 448 <h1>RFB Protocol</h1>
422 <li style="text-align: center;"><small>例:FramebufferUpdate</small></li> 449 <li style="text-align: center;"><small>例:FramebufferUpdate</small></li>
518 </p> 545 </p>
519 </div> 546 </div>
520 <!-- PAGE --> 547 <!-- PAGE -->
521 <div class="slide"> 548 <div class="slide">
522 <h1>データ転送量</h1> 549 <h1>データ転送量</h1>
523 <li>クライアントが60台の時の通常のVNCと、2分木構成にしたTreeVNCの通信網への負荷の理論値を考える。</li> 550 <li>クライアントが60台とした時、通常のVNCと、2分木構成にしたTreeVNCの通信網への負荷の理論値を考える。</li>
524 <table class="center" border=1 cellspacing="0" width=80%> 551 <table class="center" border=1 cellspacing="0" width=80%>
525 <tr> 552 <tr>
526 <td></td> 553 <td></td>
527 <td>通常のVNC</td> 554 <td>通常のVNC</td>
528 <td>TreeVNC</td> 555 <td>TreeVNC</td>
532 <td> N * データ量(クライアントの数に比例) </td> 559 <td> N * データ量(クライアントの数に比例) </td>
533 <td> (M+1) * データ量</td> 560 <td> (M+1) * データ量</td>
534 </tr> 561 </tr>
535 </table> 562 </table>
536 <p style="text-align: center;"><small>クライアントの数をN、木構造の子供の数をMとする</small> </p> 563 <p style="text-align: center;"><small>クライアントの数をN、木構造の子供の数をMとする</small> </p>
537 <li>N = 60、 M = 1 となる。</li> 564 <li>N = 60、 M = 2 、使用するエンコードはZRLEとする。</li>
538 <li>724 * 449 の画面分のデータ(0.8M)を送信するとする。 </li> 565 <li>724 * 449 の画面分のデータ(0.8M)を送信するとする。 </li>
539 566
540 </div> 567 </div>
541 <!-- PAGE --> 568 <!-- PAGE -->
542 <div class="slide"> 569 <div class="slide">
574 </small> 601 </small>
575 </div> 602 </div>
576 <!-- PAGE --> 603 <!-- PAGE -->
577 <div class="slide"> 604 <div class="slide">
578 <h1>エンコード</h1> 605 <h1>エンコード</h1>
579 <li>MacintoshでVNCを行うとZRLEを使うことができる。</li> 606 <li>MacintoshでZRLEを使ってVNCを行うことができる</li>
580 <li>データ量がRAWデータの約4分の1ですむ。</li> 607 <li>データ量がRAWデータの約4分の1ですむ。</li>
581 <li class="incremental">TreeVNCではこのZRLEを扱っている。</li> 608 <li class="incremental">TreeVNCではこのZRLEを扱っている。</li>
582 </div> 609 </div>
583 <!-- PAGE --> 610 <!-- PAGE -->
584 <div class="slide"> 611 <div class="slide">
601 <td>length</td> 628 <td>length</td>
602 </tr> 629 </tr>
603 <tr> 630 <tr>
604 <td>length</td> 631 <td>length</td>
605 <td>U8 array</td> 632 <td>U8 array</td>
606 <td>zlibData</td> 633 <td>ZlibData</td>
607 </tr> 634 </tr>
608 </table> 635 </table>
609 </small> 636 </small>
610 637 <li>VNCでZRLEを使う場合は単一のzrleストリームを使ってデータの解凍を行う。</li>
611 <li>Zlibデータ</li> 638 <li class="incremental">問題が発生</li>
612 <ul> 639 </div>
613 <li>Zlibデータは辞書を元にデータの解凍を行う</li> 640 <!-- PAGE -->
614 </ul> 641 <div class="slide">
642 <h1>ZRLEの問題</h1>
643 <li>Zlibデータは辞書を元にデータの解凍を行う</li>
615 <li class="incremental">辞書がなければデータを正しく解凍できない</li> 644 <li class="incremental">辞書がなければデータを正しく解凍できない</li>
616 </div> 645 </div>
617 <!-- PAGE -->
618 <div class="slide"> 646 <div class="slide">
619 <h1>ZRLEの問題</h1> 647 <h1>ZRLEの問題</h1>
620 <li>辞書はZlibデータの最初に送られてくる。</li> 648 <li>辞書はZlibデータの最初に送られてくる。</li>
621 <li>ZRLEのデータを最初から送ることができれば、辞書も送ることができる。</li> 649 <li>もしも、ZRLEのデータを最初から送っているのなら、辞書も送ることができる。</li>
622 <li>データの途中から送ると辞書は送られず、正しく解凍を行うことができない。</li> 650 <li>データの途中から送ると辞書は送られず、正しく解凍を行うことができない。</li>
651 <li class="incremental">Zlibデータを解凍するjava.util.zip.Deflaterがエラーを吐く</li>
623 <table class="textcenter" width=100%> 652 <table class="textcenter" width=100%>
624 <tr> 653 <tr>
625 <td> 654 <td>
626 <img src="./pix/ZRLE.png" width="600" > 655 <img src="./pix/ZRLE.png" width="600" >
627 </td> 656 </td>
642 unzip(inflater, inputs, 0 , out, INFLATE_BUFSIZE); 671 unzip(inflater, inputs, 0 , out, INFLATE_BUFSIZE);
643 // dump32(inputs); 672 // dump32(inputs);
644 int len2 = zip(nDeflater, out, 0, bufs); 673 int len2 = zip(nDeflater, out, 0, bufs);
645 </pre> 674 </pre>
646 </small> 675 </small>
647 <li>このエンコードはZRLEEと名付けた。</li> 676 <li>この圧縮し直したデータはZRLEEと名付けた。</li>
648 <table class="textcenter" width=100%> 677 <table class="textcenter" width=100%>
649 <tr> 678 <tr>
650 <td> 679 <td>
651 <img src="./pix/ZRLEE2.png" width="600"> 680 <img src="./pix/ZRLEE2.png" width="600">
652 </td> 681 </td>
725 </div> 754 </div>
726 <!-- PAGE --> 755 <!-- PAGE -->
727 <div class="slide"> 756 <div class="slide">
728 <h1>圧縮したデータの転送</h1> 757 <h1>圧縮したデータの転送</h1>
729 <li>一度ZRLEEに圧縮してしまえば、データはそのまま流すことができる。</li> 758 <li>一度ZRLEEに圧縮してしまえば、データはそのまま流すことができる。</li>
759 <li class="incremental"> -> 気にするのはスループットだけでいい。</li>
730 <li>また、データの転送は複数いる子へ並列に行われる。</li> 760 <li>また、データの転送は複数いる子へ並列に行われる。</li>
731 <p class="textcenter"> 761   <p class="textcenter">
732 <img src="./pix/MulticastQueue3.png"> 762 <img src="./pix/MulticastQueue3.png">
733 </p> 763 </p>
734 <li class="incremental">MulticastQueueクラスを用いてデータの転送を行った。</li> 764 <li class="incremental">MulticastQueueクラスを用いてデータの転送を行った。</li>
735 </div> 765 </div>
736 <!-- PAGE --> 766 <!-- PAGE -->