トップ » 技術記事 » Shibuya.abcより、携帯電話で遊べる俺様言語を作ってあそぶ(1)

Shibuya.abcより、携帯電話で遊べる俺様言語を作ってあそぶ(1) はてなブックマーク数 このエントリーをブックマークに追加

3月15日に、Shibuya.abc というイベントが開催されました。「abc」というのは、[A]ctionScript [B]yte[C]odeの略です。つまり、ActionScriptのバイトコードとかSWFバイナリについて語り合うというイベントでした。

主催だった、BeInteractive さんは、渋谷(Shibuya)駅から赤坂までは(A)バスで(B)ちょっとかかるよ(C)と言っていましたが、会場は、赤坂駅に近い、サイボウズ・ラボのオフィスをお借りして開催されました。

上記のリンクより、イベントの発表者、そしてプレゼン発表の様子を動画で見ることができます。いずれも、とても面白く発表者に釘付けになって見ていました。発表の様子は、上記のサイトより動画で見られるようになっていますが、動画を見るのも大変だと思いますので、八角研究所の技術ブログの場を借りてまとめみたいと思います。

発表の趣旨

Flash Player のバイトコードは、それほど複雑ではありません。非常にオーソドックスなスタックマシンとして実装されています。そこで、このバイトコードを吐く、オリジナル言語(俺様言語)を作ってみようというものです。実際に、プログラミング言語を実装する過程を紹介したいと思います。

発表者のクジラ飛行机は、これまで、日本語プログラミング言語「ひまわり」「なでしこ」「葵」と日本語をベースにした俺様プログラミング言語を制作しています。言語開発の楽しさが伝わったらいいなぁと思います。

なぜ、プログラミング言語を作るのか?

プログラミング言語を作るというと、難しそうだという印象がありますが、実際には、それほど難しくはありません。プログラミングの経験がある方なら、ちょっと背伸びをすれば、制作することができると思います。そして、プログラミング言語を開発するのは、「車輪の再発明」とか「時間の無駄」などとも考えられていますが、それは違います。

プログラミング言語を作ると、とても良いことがあるのです。それには、3つの理由があります。それは、以下の通りです。

  • 勉強になる
  • 作ることが楽しい
  • 何かの役に立つかも

まず、「勉強になる」という点から見ていくと、プログラミング言語を自分で実装してみることにより、プログラミング言語がどうやってできているかを学ぶことができます。また、普段の業務ではそれほど使わないような、難しい(面白い?)アルゴリズムを実際に書く機会もあります。プログラミング言語の制作は、とにかくプログラミングのスキルをあげるのにとても役に立つのです。私自身、プログラミング言語の開発を通して、多くのスキルを身につけることができました。

そして、そもそも、プログラミング言語を作ることは「楽しい」のでお勧めしたいです。自分で作ったプログラミング言語で、文字を表示したり、計算を行わせたりするだけで、とっても嬉しい気持ちになります。プログラムが、うまく動いた時の充実感は、プログラマーの皆さんが誰しも感じたことがあると思いますが、プログラミング言語の開発にも、そうした瞬間がいくつも用意されています。また、作った言語を公開して、コミュニティーができてくると、より楽しくなります。自分の作った言語を、自分の知らない誰かが使っているというところを想像してみてください。俺様言語が、俺様の枠を超え「みんなの言語」になるのです。ユーザーの人とその言語について語るのも、とても楽しい一時となります。

また、もちろん、作ったプログラミング言語が何かしらの役に立つとしたら、こんなに素晴らしいことはありません。なでしこも、もともとはちょっとした作業を自動化するためのマクロという感じで作ったのがきっかけです。「俺様の仕事を自動化するための俺様言語」になれば、すごいです。また、実用の役に立たないとしても、アドベンチャーゲームのスクリプトエンジンのようなものや、存在自体が面白い言語(パズル的な要素を持つ、Befunge や完全にネタ Whitespace )は、それだけで存在価値があると思います。

以上、このような訳で、プログラミング言語の開発は素晴らしいのです。

今回作るプログラミング言語のテーマ

せっかく、オリジナルなプログラミング言語を作るのですから、何かテーマを設けてから開発に取り掛かりたいと思います。今回のテーマは、次の2点です。

  • テーマ1:電車の中でプログラムを作りたい
  • テーマ2:手間をかけずに気軽に作りたい

まず、1つ目ですが、最近の携帯電話には、FlashLiteが搭載されているので、Flashが動くのです。携帯電話でプログラミングができたら、とても楽しそうです。携帯電話で作って、携帯電話で動かすのです。そして、それが、待ち受けFlashになったり、電話の着信Flashになれば、言うことありません。

そして、2つ目の点ですが、プログラミング言語の開発は、孤独で暗い地道な作業の連続という印象がありますので、これを払拭するために、できるだけ、頭をひねって、1日程度の作業量で、プログラミング言語の開発を体験できるように考えてみたいと思います。

手間をかけずにプログラミング言語を実装する方法

  • 【方法1】なるべく自分でプログラムを書かない→パーサジェネレータを使う

手軽にプログラミング言語を実装するには、いろいろなツールを使えば良いです。とにかく、自分でプログラムを書くと時間がかかるので、パーサジェネレーターなどのコード自動生成ツールを利用します。

  • 【方法2】携帯端末でコンパイルするのを諦める→サーバ側でコンパイル

携帯端末の中で、完結するのは、携帯端末の限界もあり、なかなか難しいです。そして、最近の携帯端末は当然ネットにつながります。そこで、携帯端末では、プログラムの入力と実行を行い、プログラムのコンパイル(言語のエンジン)字体は、サーバー側でやることにしました。

  • 【方法3】SWFの生成は雛型を書き換えることで実現する→バイトコード書き換えツールを活用する

ゼロからFlashファイルを作成するのは大変です。そこで、雛型となるSWFファイルを用意しておいて、これの一部分を書き換えることで、SWFファイルを生成します。また、SWFのバイナリを作るのは結構大変なので、swfmill や Flasm といったツールを利用してSWFを作成します。これにより、プログラミング言語が担当すべき仕事がぐっと減り、アセンブラを生成するだけでよくなります。

実装開始

ここまで考えたら、あとは作るだけです。これから実装をはじめます。その前に、今回の言語を作る上で必要となるツールを揃えておきたいと思います。

swfmill — XMLファイルからSWFファイルを生成するツール

「swfmill」は、XMLからSWFファイルを生成することができるツールです。以下のようなXMLファイルから、SWFファイルを作成することができます。以下のソースを見ると分かりますが、movie というタグの中に、frame があり、その中で、textfield を定義し配置するという処理を記述することができます。何といっても、XMLでFlashの画面要素を作成できるのでとても便利です。

file: base.xml

 <?xml version="1.0" encoding="utf-8" ?>
 <movie width="320" height="240" framerate="12">

   <background color="#ffffff"/>
   <frame>
     <textfield id="a_txt" width="320" height="240" size="32"

         text="hello!"/>
     <place id="a_txt" name="a_txt" depth="10"/>
   </frame>

 </movie>

上記の、base.xml をコンパイルするには、以下のコマンドを実行します。すると、base.swf というFlashファイルが生成されます。

swfmill simple base.xml
base.xmlを変換したもの
base.xmlを変換したもの

また、swfmill では、XML→SWF、SWF→XMLの相互変換が可能なのも素晴らしい点です。そして、扱いやすく XML のフォーマットに、simple モードと、詳細モードの2つがあるのも好感持てます。(上記で見たのは、simple モードのXMLです。)

flasm — ABCの書き換え

SWF → アセンブラ、アセンブラ → SWFの相互変換が可能なツールです。まず、簡単な計算(ActionScript)を flasm で変換してみたいと思います。

/* ActionScript: */
trace ( 1 + 2 * 3 );

そして、これをFlasmのアセンブラにすると以下のようになります。

Flasmアセンブラ:
    push 1, 2, 3
    multiply
    add
    trace

Flash Playerは、単純なスタックマシン方式で実行されているので、非常に分かりやすいものになっています。上から、1,2,3の定数をスタックに積み、次の「multiply」で、3と2を下し、掛け算の結果、6をスタックに積みます。そして、その後の「add」で、6と1を下し、これを計算して、結果の7をtrace文で出力します。

kmyacc — パーサジェネレータ

パーサジェネレータとは、プログラミング言語の文法を指定すると、それを実現するプログラムを出力する構文解析機です。文法の規則から、コードを出力してくれるので、言語の矛盾を検証することもできますし、何より、素早く言語を実装することができます。

kmyacc は、GNU Yacc と同じような方法で言語を定義することができます。 C/Java/JS/PHP/ActionScript3.0 .. と多言語に対応しているのが特徴です。

今回は、サーバー側で SWFファイルを生成するので、kmacc の PHP実装を利用します。

各種ツールの関係を整理

ここまでで、各ツールの関係を整理しておきましょう。下記のように各ツールを連携して使うことで、自分で書くコーディング量をぐっと減らすことができます。

  • (1) swfmill で、元になる SWF を作る
  • (2) kmyacc でパーサを作る
  • ★プログラム→【パーサ】→アセンブラ
  • (3) flasm を使って 1 で作ったSWF のアクションを 2 で作ったアセンブラに書き換える

まとめ

ここまでで、Shibuya.abc での発表の前半を文章の形でまとめ直してみました。次回は、今回、紹介したツールを利用して、プログラミング言語を作っていきます。お楽しみに。


このサイトについて

八角研究所
株式会社八角研究所のWEBサイトですよー。 いろんなものを創り出すことのできる環境をコツコツ構築中。 いったい、いつになったらできるのか。 この技術情報サイトもそのための活動の一環のつもり。

執筆者紹介

クジラ飛行机

クジラ飛行机

くじらはんど(http://kujirahand/)にて、日本語プログラミング言語「なでしこ」(IPA未踏ユース採択)、テキスト音楽「サクラ」(OSPオンラインソフト大賞入賞)など多くのオンラインソフトを開発。著書に「Flexプロフェッショナルガイド」「なでしこ公式バイブル」、「一週間でマスターするActionScript3.0」など。

TrackBack URL :

[…] poświęconej formatowi SWF , oraz artykuł o językach programowania kompilowanych do formatu SWF Link (niestety japoński ). Warty przeczytania jest też artykuł pokazujący co daje nam […]