2016年9月3日に、北千住にある東京電機大学で開かれたHTML5 CONFERENCE 2016に参加してきました。

この文章は、自分が見たもの感じたものの記録です。

内容に間違いがある場合、講演者ではなく自分に責があります。

ありがたいことにスライドリンク集 http://qiita.com/hidenorly/items/40ac3e9dbf757ce4df52 がありましたので、スライドを見ながら思い出し思い出し書いていきます。

基調講演

基調講演は2本立てでした。1本目が慶応大学の中村修さん、2本目が及川卓也さんです。

基調講演1本目 - 中村修さん

ツイッターを見るとエモエモ言っておりますが、実際ワクワク感が大きいお話でした。

そもそもWebとは何か?という問いに対する答えが

Webとは、世界を股にかける分散OSである

というのですから、意味はわからないけどすげーっっというお話です。

基調講演2本目 - 及川卓也さん

すみません。急な大腸近辺の不具合により、話半分にしか聞いてません。

モバイルWebのUXは最悪。すぐに広告をクリックさせようとする

:speech_balloon: 数多あるまとめサイトとかのことですかねww?

Webは死んだと何度も言われているが、その度に生き返った

:speech_balloon: きっとWebの終焉はDNSからやってきそうな気もします

ブラウザ用のCPUをつくるよ!WebAssemblyで - 清水智広さん

魅力的な講演が多くて、どれにしようか悩みました。全く未知のWebAssemblyにしました。

つかみ

「清水です。Mozilla Japanから来ました。Mozillaには浅井という有名なエヴァンジェリストがいますが、自分は有名じゃないほうです」

:speech_balloon:

WebAssembly登場の背景

速いJavaScriptといえば、asm.jsがありますが、Unityのゲームをasm.jsにコンパイルすると、ライブラリやらなんやらもくっついてきて、んっメガバイトにもなってしまいます。

当然ロードも遅い。

それを解決しようというのがWebAssemblyです。

進捗どうですか?

いったん始まって頓挫していたのですが、再開されました。
今はMozilla/Microsoft/Google/Appleの社員が関わっています。
どのひとたちも、元はvirtual machine関係の開発していた人だったりします。

そもそもなんなん?

抽象構文木をバイナリ形式で格納したものです。
だからパース要らずで速い。

WebAssemblyを使うには

2通りあります。

1つは、emccを使ってコンパイルする方法、
もう1つは、clangを使ってコンパイルする方法です。

元ソースはC/C++で書きます。

後者を使おうとしたけどうまくいかなかったので、前者がおすすめ。

WebAssemblyの将来

スレッド/共有メモリに対応したい。ですよね〜。

ライブラリを毎回読むのは大変なので、ダイナミックリンクにしたい。

DOMを操作したい。

:speech_balloon: CPU食わない→バッテリに優しい→モバイルに優しい、ということで、今はJavaScriptの置き換えはできないけれど、いつかできるようになったらいいなと思いました。

ランチセッション

運良くランチセッションに席を確保できました。
普通は提供一社で宣伝過多なのに、なんとライトニングトークというお弁当なくても聞きに来ちゃうよセッションでした。

お弁当美味しかったです。

みんなご飯に夢中だったせいか、振り返り情報少ないですね。自分もですが。

IoT Cloudのお話 - ニフティ

端的にまとめると、IoT使った楽しい提案/開発をしているので、ニフティに来てください。

とのことでした。

:speech_balloon: ニフティといえばデイリーポータルZ(異論は認める)。
:speech_balloon: デイリーポータルZのテクノ手芸部に入れるかな?

HTML/Javascriptでネイティブアプリみたいなの作るお話 - サイバード

HTML/JavascriptなのでAndroid/iOS両対応!
派手な画面もcanvasで作っちゃうよ!

とのことでした。

5分でわかるSencha Ext JS

Sencha懐かしいですね。昔は個人ユーザ向けにやってましたが、今はエンタープライズ向けにやっているそうです。

日本事務器

事務と名がつくけれど、机とか椅子とか売ってません。ITの会社です。
結構歴史長いです。
会社名は「機」じゃなくて「器」です。
社長は新しもの好きで、すぐにガジェット買ってきます。買ってきたガジェットは、社員に割り当てられて研究対象になります。
日本事務器に来てください。

とのことでした。

おんせんUI

HTML/Javascriptでモバイルアプリ作っちゃうよ!
Apache CordovaのWebサイトに載ってるよ! → https://cordova.apache.org/
もうすぐ2.0が出るよ!フレームワークへの依存をなくしたよ!
Android/iOSを認識して、UIフレーバを自動切り替えできるのはOnsen UIだけ!

とのことでした。

:speech_balloon: いいかも。

Unityのお話

Unityはゲームだけじゃない!

Javascriptで表計算アプリが作れる - Grapecity

ブラウザ上でExcelみたいなアプリが作れます!
カイル君!
数式!
グラフ!
Excelへのエクスポート!

とのことでした。

:speech_balloon: Excelがいいんじゃぁー、クラウドにしたいんじゃぁー、というお客さんに最適。canvasで実現しているそうです。

AudioとガジェットをWebで遊ぶ - Web Audio/MIDI, Web Bluetooth - 河合良哉さん

大腸の不具合再発につき、遅れて参戦。
デモたっぷりの愉快なセッションでした。

Web Audio

ブラウザでDSPみたいなことができます。
FM音源も作れるよ。

Web MIDI

ブラウザでMIDI機器とやりとりできます。
MIDIは単純で便利だけれど、有線だし、In/Outが別決線だし、ちょっといけてない。

無線にしたい ==> Web Bluetooth へ

Web Bluetooth

Bluetooth機器をブラウザから制御できちゃうよ。

Arduino 101からBluetoothで繋げられるよ。

The First Step to Angular 2 - lacoさん

Angular 2の入り口から、アーキテクチャ的なところまでのお話でした。
Angular 1は使っていましたので、どのようなものかと聞くことにしました。

だいたいは知っていたのですが、Angular 2はコンポーネントを中心に開発をすることになり、Angular 1のHTMLへコントローラをバインディングするような感じじゃないみたいです。

:speech_balloon: Angular 1のほうが、HTMLデザイナフレンドリでよかったかなぁと思ったり。

Routing is Hard !

Angular 2のURLルータは、ng routerが作られ、router v2が提案されて2週間で捨てられ、現在3代目。
とかくルーティングは難しい。

Creating VR experiences on the Web with WebVR and A-Frame - Casey Yeeさん

ブラウザが対応しているHMDを接続していれば、VRコンテンツ画面にHMDボタンが表示されるそうです。

VR作るのは大変だけど、A-Frame使えば簡単だよ!というお話でした。

A-Frame ==> https://aframe.io/

:speech_balloon: タグを書いて3Dって、昔何かで見ましたね。

JavaScriptなしで、ゲームっぽいものも作れるみたいです。試してみたい。

Web 技術動向とブラウザベンダー戦略のこれから - 浅井智也さん

:speech_balloon: twitterの煽りに乗って、テキストエディタ対決を抜けてこちらへ来ました :smile:

企業向けにMozilla Japanでサポートを始めました。いろいろな企業のカスタマイズ要求に応えています。自動アップデートを無効にしたり、ID/パスワードの保存機能を無くしたり、etc…

Mozillaは標準に従って頑張っている!
ベンダープレフィックス -webkit-* は必要悪だったのに、標準入りして悔しい!

:speech_balloon: アジア圏のWebサイトがベンダプレフィックス使いまくりだから。。。

ライトニングトーク大会

Webブラウザをサーバにしちゃうよ

:speech_balloon: 何を言っているかわからないと思うが、俺も何を(ry

Webブラウザをサーバにすれば、サーバサイドもクライアントサイドも、同じJavaScriptコードベースでいけるよ。そしてやってみた。

githubのURLをお客さんに教えれば、お客さんのブラウザがサーバになる。不要になったらブラウザを閉じればOK。すげーいい。

とのことでした。

p5.js

processingという言語をベースにしたJavaScriptライブラリ(?)紹介でした。

発表者さんは、東洋経済オンラインで漫画を書いているそうです。
http://toyokeizai.net/category/diary

Google Cloud APIを使って事務作業を効率化するよ

赤ちゃんを産んで時短勤務となり、エンジニアな部署から総務な部署に異動したひとのお話です。

旧態依然とした総務部の仕事はストレスがたまる

とくに帳票!やつは敵だ!

エンジニアリングすべし!

Google Cloud APIを使って帳票を画像認識、文字列の取り出しに成功!

基幹システムが吐き出した帳票を、画像認識して基幹システムに戻すことに成功!

ん!?

最初から帳票介さず連携する基幹システム作ればいいんじゃね?

とのことでした。

:speech_balloon: 若い人が多いのに、意外にうなづいている人が多かった。 日本のITの夜明けはまだまだぜよ :sweat:

HTML5クイズ

HTML5の知識、、、はあまり要らないクイズでしたww

  • 2014年において、定義されているHTMLタグの数はいくつ
    答えは108個ですが、109個と回答したひとが一番多かったです。
  • V8エンジンを搭載しているブラウザはどれ?
    回転するChromeっぽいロゴから4択ww
  • 1989年に公開されたドラえもん映画は?
    HTML関係ねぇーww

他に4問、全7問出ました。

まじめに検索して回答すれば、上位にいけたかも。
全問正解はひとりかふたりでしたしね。

感想

こんな大規模なイベントを、無料でやっちゃうHTML5界隈はすごいと思いました。
参加者も全体的に若いです。