サーバサイド JavaScript の 歴史と未来

1. サーバサイド JavaScript の歴史と未来 Shibuya.js Technical Talk #2 竹迫 良範 <takesako@namazu.org>

2. 前回のshibuya.js#1の振り返り • 最後に生き残るのはJavaScriptかもな • JavaScriptのこれまでの10年とこれからの10年 • これまでの10年でクライアントサイドを征覇した • これからの10年でどこまで領域を広げるか etoさん基調講演

3. クライアントサイドは制覇した

4. 昔：サーバサイドのプログラミング言語 Ruby Perl PHP Java サーバサイド （Webサーバ） JavaScript クライアントサイド （ブラウザ）

5. 今：サーバサイド言語でJavaScript生成 Ruby Perl PHP Java サーバサイド （Webサーバ） 本居宣長の方法 JavaScript クライアントサイド （ブラウザ） GWT J2S RJS とか

6. 未来：JavaScriptで全部書く！ Ruby Perl PHP Java JavaScript サーバサイド （Webサーバ） 夏目漱石の方法 クライアントサイド （ブラウザ）

7. これからの時代は サーバサイド JavaScript

8. これまでのサーバサイドJavaScript 商用プロダクト編

9. サーバサイドJavaScriptの有名どころ • Microsoft IIS • ASP (Active Server Page) • VBScript / PerlScript / Jscript … • LiveWire JavaScript から発展 • Netscape Enterprise Server • iPlanet • Sun Java System Web server • BroadVision • One-To-One Enterprise いろいろ

11. DreamArts ひびき®シリーズ http://hibiki.dreamarts.co.jp/index.html

12. DreamArts ひびき®シリーズ • サーバサイドJavaScriptを採用 • パッケージ製品である「ひびき」に対する顧客要望別プラグインを JavaScript で記述 • JavaScript処理系 • Rhino + Velocity (Java)

13. DreamArts ひびき®シリーズ • プラグインで可能なこと • API を利用した内部データへのアクセス • JDBCコネクションプールによるDBアクセス • 製品で提供されている拡張ポイントを利用して製品仕様を変更する • トランザクション内のフックにより他のシステムとのデータリアルタイム連携 • 製品内に保持しているデータのグラフ化

14. DreamArts ひびき®シリーズ • サンプルプログラム function service(request, response) { var hibikidb = Hibiki.getDatabaseSession(); var isdb = Hibiki.getDatabaseSession('isdb'); if (hibikidb == null || isdb == null) { log.fatal("Failed to check my DB server!"); return sendError(response); } var f = new java.io.File(Hibiki.getDataDirectory() + "/health-check.dat"); if (!f.exists()) { log.fatal("Failed to check my file server!"); return sendError(response); } return "/success.vm"; } /* * ロードバランサから監視する場合のヘルスチェックリスナーサンプル * 正常に稼働している場合には、/success.vm の内容が送信される。 * データベースおよびファイルのどちらかに異常がある場合には、 * HTTPステータスコード500を返して終了する。- sendError() */

15. INSUITE®セキュリティアダプタ http://www.insuite.jp/merit/security.html

16. INSUITE®セキュリティアダプタ • サーバサイドJavaScriptを採用 • Apache2 の挙動を JavaScript でコントロール • mod_perl や mod_python などと同じ • Apache2 の各種ハンドラを JavaScript で記述 • LDAP認証やリバースプロキシ、SSL証明書の取り扱いなどの組み込みオブジェクトを用意 • JavaScript処理系 • SpiderMonkey + Apache2

17. INSUITE®セキュリティアダプタ • サンプルプログラム • SSL以外でリクエストされた場合にSSLにリダイレクトする $ cat redirect_to_https.js Apache.translateName = function { if (request.uri.match("^/images/(.*)")) decline(); if (request.uri.match("^/i/(.*)") || request.uri.match("^/_/(.*)")) decline(); redirect("https://" + request.hostname + request.uri); }

18. 未踏ソフトウェア編 サーバサイドJavaScriptの実装

19. http://www.ipa.go.jp/about/jigyoseika/04fy-pro/mito/2004-861a.pdfhttp://www.ipa.go.jp/about/jigyoseika/04fy-pro/mito/2004-861a.pdf

22. Mayaa – JavaServer Templates

23. Mayaa の位置づけ a

24. Java系オープンソースのサーバサイド JavaScript いくつか紹介

25. Sarugau JS（さるごーJS） • サーバサイドDHTMLエンジン • Java上で動作する JavaScript と DIコンテナを使ったプレゼンテーション層用のフレームワーク • JavaScript処理系 • Rhino (Java) • サーバサイドDHTML • Rhino のラップドファクトリ機構を利用 • ブラウザの innerHTML, style などのDOM拡張

26. Sarugau JS（さるごーJS）

27. firecat – JavaScript WebServer • 処理系 • W3C Jigsaw (HTTP) + FESI (ECMAScript) • ライセンス • LGPL • http://betaworks.netbeans.jp/Wiki.jsp?page=Firecat

28. firecat – JavaScript WebServer • サンプルプログラム <%@page content_type="text/html; charset=Shift-JIS"%> <% var msg = "あなたのIPアドレスは"; var remote_ip = request.getRemoteAddr(); msg = msg + remote_ip; %> <%=msg%>

29. その他 • mod_gcj / Rhinola • Rhino + GCJ4.0 + Apache mod_gcj • http://mod-gcj.sourceforge.net/rhinola.html • Helma - Javascript Web Application Framework • Rhino + Jetty • Helma License version 2.0 • http://www.helma.org/

30. 今年の新たな動き JSAN関連

32. Oku Kazuho @ Cybozu Labs • サーバサイドで JavaScript の単体テスト • JSAN の Test.Simple をWindows Scripting Host (WSH) に移植 • Test-Simple-WSH.patch • runtests.js • Windows のコマンドプロンプトでJavaScript ライブラリのテストが動く > cscript.exe runtests.js testsrc.js

33. Oku Kazuho @ Cybozu Labs • JSAN-ASP.patch • ASP で JSAN を使うパッチ (2006/3/24) <script language="JavaScript" src="JSAN.js" runat="server"></script> <script language="JavaScript" runat="server"> JSAN.use("Digest.MD5", ":all"); Response.write(md5Hex("hello")); </script>

34. これからの時代は サーバサイド JavaScript

35. プロジェクト AJAJA（仮称） 本日初公開

36. プロジェクトAJAJA（仮称） • AJAJA • Asynchronous JavaScript and JavaScript/ASP • 最初の動機（構想） • ブラウザ上で動く JavaScript と、ウェブサーバで動く JavaScript とを相互に通信させることで、JavaScriptのみによる Ajax なシステムを作れるようにしてみよう • 開発者 • 西田圭介さん　（＋アルファギークな仲間達） • フリープログラマ • OpenCOBOLの開発者 • Gonzuiの開発者でもある • 某商用VPNソフトウェアの開発者

37. プロジェクトAJAJA（仮称） • オープンソースな JavaScript/ASP の実装 • IIS の記法がそのまま使える（過去の資産の継承） • 処理系 • SpiderMonkey • CGI で提供 • /usr/bin/asp_js コマンド • SQLite3標準サポート • use('SQLite'); • db = new SQLite('sample.db');

38. サンプルプログラム • hello.asp <%@ Language=JavaScript %> <% var hello = "Hello world"; %> <html> <head> <title><%= hello %></title> </head> <body> <h1><%= hello %></h1> </body> </html>

39. 実行処理系のベンチマーク CPU: Pentium 4 3GHz OS: RHEL4 Update 3 (Linux 2.6.9-34) JS は SpiderMonkey を DEBUG モードでビルド JS(OPT=1)は SpiderMonkey を BUILD_OPT=1 でビルド

40. プロジェクト AJAJA（仮称） JavaScript/ASP デモ

41. [ソース]

42. デモ製作：haltさん • JavaScript/ASP demo – Simple BBS

43. Yet Another Demo

44. ただいま空前の素数ブーム LL Ring キミならどう書く 2.0 前哨戦 Round 1 お題「100までの整数から素数を列挙せよ」

45. Brainf*ckで100までの素数を列挙してみるテスト

48. function BF(str){ this.code = []; this.output = []; this.input = []; this.data = []; this.pc = this.sp = 0; this.debug = 0; this.step = function(){ var op = bf.code[this.pc]; if (bf.debug){ document.writeln([op, bf.sp, bf.pc].join(",")); } switch (op) { case '<' : bf.sp--; break; case '>' : bf.sp++; break; case '+' : if(!bf.data[bf.sp]) bf.data[bf.sp] = 0; bf.data[bf.sp]++ ; break; case '-' : if(!bf.data[bf.sp]) bf.data[bf.sp] = 0; bf.data[bf.sp]--; break; case '.' : bf.output.push(bf.data[bf.sp]) ; break; case ',' : bf.data[bf.sp] = bf.input.shift() ; break; case '[' : if (bf.data[bf.sp]) break; nest = 1; while(nest){ bf.pc++; nest += bf.code[bf.pc] == '[' ? +1 : bf.code[bf.pc] == ']' ? -1 : 0; } break; case ']' : nest = 1; while(nest){ bf.pc--; nest -= bf.code[bf.pc] == '[' ? +1 : bf.code[bf.pc] == ']' ? -1 : 0; }; bf.pc--; break; }; bf.pc++; }

49. Brainf*ck への応用 • ./Brainfuck.js • function BF(str)の定義 • ./demo.asp • クライアントサイド • <script src=“Brainfuck.js”></script> • サーバサイド • <% use(‘Brainfuck’) %>

50. サーバ/クライアントで.jsを共有 • 有名なJavaScriptライブラリをサーバサイドでも • prototype.js • MotchiKit • JSANモジュール • JavaScriptライブラリをみんなでshare • Validationロジックの共通化 • フォームの入力値のチェック • 数値、文字列の長さ • DRYの原則（Don’t Repeat Yourself）