Mercurial > hg > Events > OSC2011
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 |