comparison presen/index.html~ @ 7:63b061716258

modify
author Nobuyasu Oshiro <dimolto@cr.ie.u-ryukyu.ac.jp>
date Sat, 10 Sep 2011 05:46:47 +0900
parents d3785522a5bc
children 9ecd6c8cfb68
comparison
equal deleted inserted replaced
6:4573aaf1bf0b 7:63b061716258
85 </div> 85 </div>
86 <!-- PAGE --> 86 <!-- PAGE -->
87 <div class="slide"> 87 <div class="slide">
88 <h1>本日の内容</h1> 88 <h1>本日の内容</h1>
89 <li>友人と作ったJavaによる画面共有システム「TreeVNC」について</li> 89 <li>友人と作ったJavaによる画面共有システム「TreeVNC」について</li>
90 <li>TreeVNCを作るにあたって学んだJavaでの並列プログラミングの仕方やVNCの話</li> 90 <li>TreeVNCを作るにあたって学んだJavaでの並列プログラミングの仕方やVNCのプロトコル話</li>
91 </div> 91 </div>
92 <!-- PAGE --> 92 <!-- PAGE -->
93 <div class="slide"> 93 <div class="slide">
94 <h1>TreeVNCの目的と背景</h1> 94 <h1>TreeVNCの目的と背景</h1>
95 <li>大学の講義中、スクリーンに映されている画面は後ろの席程見えずらい。 </li> 95 <li>大学の講義中、スクリーンに映されている画面は後ろの席程見えずらい。 </li>
107 <div class="slide"> 107 <div class="slide">
108 <h1>VNCを用いての画面共有</h1> 108 <h1>VNCを用いての画面共有</h1>
109 <li>まず、iMacで複数のPCからVNCをかけてみた。</li> 109 <li>まず、iMacで複数のPCからVNCをかけてみた。</li>
110 <li class="incremental">-> 10台と繋ぐ前にVNCでの画面がカクカクに... </li> 110 <li class="incremental">-> 10台と繋ぐ前にVNCでの画面がカクカクに... </li>
111 <li class="incremental">さらにCPU使用率も跳ね上がった。</li> 111 <li class="incremental">さらにCPU使用率も跳ね上がった。</li>
112 <li class="incremental">原因について考えたみる。</li>
112 </div> 113 </div>
113 <!-- PAGE --> 114 <!-- PAGE -->
114 <div class="slide"> 115 <div class="slide">
115 <h1>通常のVNCの問題点</h1> 116 <h1>通常のVNCの問題点</h1>
116 <table class="center"> 117 <table class="center">
244 <ul> 245 <ul>
245 <li>RFB Protocol</li> 246 <li>RFB Protocol</li>
246 <li>データ転送量</li> 247 <li>データ転送量</li>
247 <li>ZRLE Encodingの問題</li> 248 <li>ZRLE Encodingの問題</li>
248 <li>データ転送に用いたMulticastQueueについての説明</li> 249 <li>データ転送に用いたMulticastQueueについての説明</li>
249 <li>木構造の再構築</li> 250 <li>木構造の再構築(谷成さん)</li>
250 </ul> 251 </ul>
251 </div> 252 </div>
252 <!-- PAGE --> 253 <!-- PAGE -->
253 <div class="slide"> 254 <div class="slide">
254 <h1>RFB protocol</h1> 255 <h1>RFB protocol</h1>
292 <div class="slide"> 293 <div class="slide">
293 <h1>RFB Protocol</h1> 294 <h1>RFB Protocol</h1>
294 <li>FramebufferUpdateRequest:</li> 295 <li>FramebufferUpdateRequest:</li>
295 <li><small>画面に差分が発生したらサーバから教えて貰うためのリクエスト</small></li> 296 <li><small>画面に差分が発生したらサーバから教えて貰うためのリクエスト</small></li>
296 <small> 297 <small>
297 <table> 298 <table width=100% style="text-align: center;">
298 <td width=50%> 299 <td width=50%>
299 <table border=1 cellspacing="0"> 300 <table border=1 cellspacing="0">
300 <tr> 301 <tr>
301 <td>バイト数</td> 302 <td>バイト数</td>
302 <td><pre>型   [値]</pre></td> 303 <td><pre>型   [値]</pre></td>
339 <td>height</td> 340 <td>height</td>
340 </tr> 341 </tr>
341 342
342 </table> 343 </table>
343 </td> 344 </td>
345 <td>
346 <img src="./pix/TreeVNC1.png" width=90%>
347 </td>
344 </table> 348 </table>
345 <li>このリクエストはTop Proxyだけが行う。 </li>
346 </small> 349 </small>
350 <li><small>このリクエストはTop Proxyだけが行う。</small> </li>
347 </div> 351 </div>
348 <!-- PAGE --> 352 <!-- PAGE -->
349 <div class="slide"> 353 <div class="slide">
350 <h1>RFB Protocol</h1> 354 <h1>RFB Protocol</h1>
351 <li>FramebufferUpdate: <small>画面の更新データ</small></li> 355 <li>FramebufferUpdate:<small>画面の更新データ</small></li>
352 356 <table width="100%">
357 <td width=50%>
353 <small> 358 <small>
354 <table border=1 cellspacing="0" > 359 <table border=1 cellspacing="0" >
355 <tr> 360 <tr>
356 <td>バイト数</td> 361 <td>バイト数</td>
357 <td><pre>型   [値]</pre></td> 362 <td><pre>型   [値]</pre></td>
375 <td><pre>U16<pre></td> 380 <td><pre>U16<pre></td>
376 <td>number-of-rectangles</td> 381 <td>number-of-rectangles</td>
377 </tr> 382 </tr>
378 383
379 </table> 384 </table>
380 <li>以下number-of-rectanglesの数だけ矩形のデータが続く</li> 385 <li><small>以下number-of-rectanglesの数だけ矩形のデータが続く</small></li>
381 386
382 <table width=100%> 387 <table width=100%>
383 <td> 388 <td>
384 <table border=1 cellspacing="0" width=50%> 389 <table border=1 cellspacing="0" width=100%>
385 <tr> 390 <tr>
386 <td>バイト数</td> 391 <td>バイト数</td>
387 <td><pre>型   </pre></td> 392 <td><pre>型   </pre></td>
388 <td>説明 </td> 393 <td>説明 </td>
389 </tr> 394 </tr>
429 </td> 434 </td>
430 <td> 435 <td>
431 </td> 436 </td>
432 437
433 </table> 438 </table>
434
435
436 </small> 439 </small>
440 </td>
441 <td width>
442 <img src="./pix/TreeVNC2.png" width=90%>
443 </td>
444 </table>
445
437 </div> 446 </div>
438 <!-- PAGE --> 447 <!-- PAGE -->
439 <div class="slide"> 448 <div class="slide">
440 <h1>RFB Protocol</h1> 449 <h1>RFB Protocol</h1>
441 <li style="text-align: center;"><small>例:FramebufferUpdate</small></li> 450 <li style="text-align: center;"><small>例:FramebufferUpdate</small></li>
551 <td> N * データ量(クライアントの数に比例) </td> 560 <td> N * データ量(クライアントの数に比例) </td>
552 <td> (M+1) * データ量</td> 561 <td> (M+1) * データ量</td>
553 </tr> 562 </tr>
554 </table> 563 </table>
555 <p style="text-align: center;"><small>クライアントの数をN、木構造の子供の数をMとする</small> </p> 564 <p style="text-align: center;"><small>クライアントの数をN、木構造の子供の数をMとする</small> </p>
556 <li>N = 60、 M = 1 、使用するエンコードはZRLEとする。</li> 565 <li>N = 60、 M = 2 、使用するエンコードはZRLEとする。</li>
557 <li>724 * 449 の画面分のデータ(0.8M)を送信するとする。 </li> 566 <li>724 * 449 の画面分のデータ(0.8M)を送信するとする。 </li>
558 567
559 </div> 568 </div>
560 <!-- PAGE --> 569 <!-- PAGE -->
561 <div class="slide"> 570 <div class="slide">
593 </small> 602 </small>
594 </div> 603 </div>
595 <!-- PAGE --> 604 <!-- PAGE -->
596 <div class="slide"> 605 <div class="slide">
597 <h1>エンコード</h1> 606 <h1>エンコード</h1>
598 <li>MacintoshでVNCを行うとZRLEを使うことができる。</li> 607 <li>MacintoshでZRLEを使ってVNCを行うことができる</li>
599 <li>データ量がRAWデータの約4分の1ですむ。</li> 608 <li>データ量がRAWデータの約4分の1ですむ。</li>
600 <li class="incremental">TreeVNCではこのZRLEを扱っている。</li> 609 <li class="incremental">TreeVNCではこのZRLEを扱っている。</li>
601 </div> 610 </div>
602 <!-- PAGE --> 611 <!-- PAGE -->
603 <div class="slide"> 612 <div class="slide">
620 <td>length</td> 629 <td>length</td>
621 </tr> 630 </tr>
622 <tr> 631 <tr>
623 <td>length</td> 632 <td>length</td>
624 <td>U8 array</td> 633 <td>U8 array</td>
625 <td>zlibData</td> 634 <td>ZlibData</td>
626 </tr> 635 </tr>
627 </table> 636 </table>
628 </small> 637 </small>
629 638 <li>VNCでZRLEを使う場合は単一のzrleストリームを使ってデータの解凍を行う。</li>
630 <li>Zlibデータ</li> 639 <li class="incremental">問題が発生</li>
631 <ul> 640 </div>
632 <li>Zlibデータは辞書を元にデータの解凍を行う</li> 641 <!-- PAGE -->
633 </ul> 642 <div class="slide">
643 <h1>ZRLEの問題</h1>
644 <li>Zlibデータは辞書を元にデータの解凍を行う</li>
634 <li class="incremental">辞書がなければデータを正しく解凍できない</li> 645 <li class="incremental">辞書がなければデータを正しく解凍できない</li>
635 </div> 646 </div>
636 <!-- PAGE -->
637 <div class="slide"> 647 <div class="slide">
638 <h1>ZRLEの問題</h1> 648 <h1>ZRLEの問題</h1>
639 <li>辞書はZlibデータの最初に送られてくる。</li> 649 <li>辞書はZlibデータの最初に送られてくる。</li>
640 <li>ZRLEのデータを最初から送ることができれば、辞書も送ることができる。</li> 650 <li>もしも、ZRLEのデータを最初から送っているのなら、辞書も送ることができる。</li>
641 <li>データの途中から送ると辞書は送られず、正しく解凍を行うことができない。</li> 651 <li>データの途中から送ると辞書は送られず、正しく解凍を行うことができない。</li>
652 <li class="incremental">Zlibデータを扱うZlibInStreamがエラーを吐く</li>
642 <table class="textcenter" width=100%> 653 <table class="textcenter" width=100%>
643 <tr> 654 <tr>
644 <td> 655 <td>
645 <img src="./pix/ZRLE.png" width="600" > 656 <img src="./pix/ZRLE.png" width="600" >
646 </td> 657 </td>
651 </table> 662 </table>
652 </div> 663 </div>
653 <!-- PAGE --> 664 <!-- PAGE -->
654 <div class="slide"> 665 <div class="slide">
655 <h1>ZRLEE</h1> 666 <h1>ZRLEE</h1>
656 <li>そこで、Top ProxyにZRLEのデータを再度圧縮し直すことで辞書を付けてもらうことにした。以下はその部分のソースである。</li> 667 <li>そこで、ProxyがZRLEを使ってデータを受け取り圧縮し直して木の下へ流していくことにした。</li>
657 <small> 668 <small>
658 <pre> 669 <pre>
659 Deflater nDeflater = deflater; // new Deflater(); 670 Deflater nDeflater = deflater; // new Deflater();
660 LinkedList<ByteBuffer> out = new LinkedList<ByteBuffer>(); 671 LinkedList<ByteBuffer> out = new LinkedList<ByteBuffer>();
661 unzip(inflater, inputs, 0 , out, INFLATE_BUFSIZE); 672 unzip(inflater, inputs, 0 , out, INFLATE_BUFSIZE);
662 // dump32(inputs); 673 // dump32(inputs);
663 int len2 = zip(nDeflater, out, 0, bufs); 674 int len2 = zip(nDeflater, out, 0, bufs);
664 </pre> 675 </pre>
665 </small> 676 </small>
666 <li>この圧縮し直したデータはZRLEEと名付けた。</li> 677 <li><small>この圧縮し直したデータはZRLEEと名付けた。</small></li>
667 <table class="textcenter" width=100%> 678 <table class="textcenter" width=100%>
668 <tr> 679 <tr>
669 <td> 680 <td>
670 <img src="./pix/ZRLEE2.png" width="600"> 681 <img src="./pix/ZRLEE2.png" width="600">
671 </td> 682 </td>
683 if (rfb.updateRectEncoding==RfbProto.EncodingZRLEE) 694 if (rfb.updateRectEncoding==RfbProto.EncodingZRLEE)
684 zrleInStream = null; 695 zrleInStream = null;
685 if (zrleInStream == null) 696 if (zrleInStream == null)
686 zrleInStream = new ZlibInStream(); 697 zrleInStream = new ZlibInStream();
687 </pre> 698 </pre>
688 <li>JavaではZlibの辞書の取り出しが実装されていなかった為、このような方法をとることになった。</li> 699 <li>Zlibの規約には辞書の取り出し(flush)については書かれている。</li>
689 <li class="incremental">ZRLEに比べるとデータ量は増えないのか...?</li> 700 <li>Javaでは実装されていなかった為、このような方法をとることになった。</li>
690 </div> 701 </div>
691 <!-- PAGE --> 702 <!-- PAGE -->
692 <div class="slide"> 703 <div class="slide">
693 <h1>ZRLEEのデータ量</h1> 704 <h1>ZRLEEの疑問点</h1>
705 <li>ZRLEEには毎回辞書が付与されている。</li>
694 <p class="textcenter"> 706 <p class="textcenter">
695 <img src="./pix/ZRLEE2.png" width="600"> 707 <img src="./pix/ZRLEE2.png" width="600">
696 </p> 708 </p>
697 <li>毎回辞書の付与がされるため、ZRLEに比べるとデータ量が増える...?</li> 709 <li class="incremental">ZRLEに比べるとデータ量は増えないのか...?</li>
698 <li class="incremental">ZRLEと比較してみるとデータ量は変わらないことが判明</li> 710 <li class="incremental">-> ZRLEと比較してみるとデータ量は変わらないことが判明</li>
699 </div> 711 </div>
700 <!--PAGE--> 712 <!-- PAGE -->
701 <div class="slide"> 713 <div class="slide">
702 <h1>ZRLEEのデータ量</h1> 714 <h1>ZRLEEのデータ量</h1>
703 <p style="text-align: center;"> 715 <p style="text-align: center;">
704 <small>1920*1080の描画にかかったデータ量</small> 716 <small>1920*1080の描画にかかったデータ量</small>
705 </p> 717 </p>
722 </tr> 734 </tr>
723 </table> 735 </table>
724 </td> 736 </td>
725 </tr> 737 </tr>
726 </table> 738 </table>
739 <li>ZRLEよりデータ量が多くなるどころか少ない。</li>
727 <li>原因</li> 740 <li>原因</li>
728 <ul> 741 <ul>
729 <li>ZRLEEは送られるデータ毎で最適な辞書が使われる。</li> 742 <li>ZRLEEは送られるデータ毎で最適な辞書が使われる。</li>
730 </ul> 743 </ul>
731 </div> 744 </div>
732 <!-- PAGE --> 745 <!-- PAGE -->
733 <div class="slide"> 746 <div class="slide">
734 <h1>ZRLEEを使う利点</h1> 747 <h1>ZRLEEを使う利点</h1>
735 <li>データ量が少なくすむ</li> 748 <li>データ量が少なくですむ</li>
736 <ul> 749 <ul>
737 <li>ZRLEよりも少なくですむ可能性がある。</li> 750 <li>ZRLEよりも少なくですむ可能性がある。</li>
738 <li>圧縮率が高い為プロキシのメモリを食わないですむ。</li> 751 <li>圧縮率が高い為プロキシのメモリを食わないですむ。</li>
752 <li>一度ZRLEEに圧縮してしまえば、データはそのまま流すことができる。</li>
753 <li>TreeVNCの設計にある「データを木の下へ流す」の条件を満たす。</li>
739 </ul> 754 </ul>
740 <li>そのままデータを流すことができる</li>
741 <ul>
742 <li>圧縮作業は一回ですむ。</li>
743 </ul>
744 </div> 755 </div>
745 <!-- PAGE --> 756 <!-- PAGE -->
746 <div class="slide"> 757 <div class="slide">
747 <h1>圧縮したデータの転送</h1> 758 <h1>圧縮したデータの転送</h1>
748 <li>一度ZRLEEに圧縮してしまえば、データはそのまま流すことができる。</li> 759 <li>データの転送は複数いる子へ並列に行う。</li>
749 <li class="incremental"> -> 気にするのはスループットだけでいい。</li>
750 <li>また、データの転送は複数いる子へ並列に行われる。</li>
751   <p class="textcenter"> 760   <p class="textcenter">
752 <img src="./pix/MulticastQueue3.png"> 761 <img src="./pix/MulticastQueue3.png">
753 </p> 762 </p>
754 <li class="incremental">MulticastQueueクラスを用いてデータの転送を行った。</li> 763 <li class="incremental">MulticastQueueクラスを用いた並列な転送を行った。</li>
755 </div> 764 </div>
756 <!-- PAGE --> 765 <!-- PAGE -->
757 <div class="slide"> 766 <div class="slide">
758 <h1>MulticastQueue</h1> 767 <h1>MulticastQueue</h1>
759 <li>MulticastQueue:データを順序よく読み込ませるクラス</li> 768 <li>MulticastQueue:データを順序よく読み込ませるクラス</li>
1191 <Font color="red"> 1200 <Font color="red">
1192 connectAndAuthenticate(); 1201 connectAndAuthenticate();
1193 </Font> 1202 </Font>
1194 <br> 1203 <br>
1195 プロキシから受け取ったデータをもとに接続を開始する関数。 1204 プロキシから受け取ったデータをもとに接続を開始する関数。
1205 <br>
1206 この時クライアント6がクライアント1に変わる。
1196 1207
1197 </Font> 1208 </Font>
1198 </td> 1209 </td>
1199 </td> 1210 </td>
1200 </table> 1211 </table>
1247 1258
1248 </Font> 1259 </Font>
1249 </td> 1260 </td>
1250 </td> 1261 </td>
1251 </table> 1262 </table>
1263 </div>
1264 </div>
1265
1266 <!-- PAGE -->
1267 <div class="slide">
1268 <div class="taninaritop" >
1269 <h1>木の再構成手順</h1>
1270 <center><h2>再構成後の木</h2></center>
1271 <center><img class="scale" src="pix/reuml7.png" alt=""></center>
1252 </div> 1272 </div>
1253 </div> 1273 </div>
1254 1274
1255 <!-- PAGE --> 1275 <!-- PAGE -->
1256 1276