Skip to content

Instantly share code, notes, and snippets.

@saitoxu
Last active September 4, 2016 11:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save saitoxu/f60e99979b45f78a914a82f1b5237c2a to your computer and use it in GitHub Desktop.
Save saitoxu/f60e99979b45f78a914a82f1b5237c2a to your computer and use it in GitHub Desktop.

2016/09/03に参加したHTML5 Conferenceのメモ。

基調講演含め6つのセッションを聞いた。

適当に要約しているため実際の内容と変わっているかもしれないがあしからず(あと敬称略)。

基調講演

WEBという名前の大規模分散オペレーティング・システム

W3C/Keio 中村 修

NetflixがHDR対応

WEBもHDRに対応する必要があるのでは

e.g. あるピクセルの色をこう変えようみたいに、エンジニアができないのはどうなのか

Big data, AI, IoTなどのバズワード→インターネットの上に乗っかっている(インターネットがあるから成り立っている)

UNIXとWebの対比(計算資源、管理・提供方法)→Webは大規模分散OSと言える

テレビの世界はHTML5準拠

車のインパネはいずれ全てディスプレイになるだろう

ビットコインではどうやって信用(trust)を作るのか?

Webなんだから、みんなで信用を作りたい、Blockchainはその可能性があるから面白い

W3CではWeb of Things (WoT)の仕様策定が進んでいる(現状はWoT Servantが有力らしい)

HTML5 Conference 2016

Increments 及川 卓也

HTML5 nearly equal Web

  • アプリケーションとしてのWeb
  • メディアとしてのWeb
  • 基盤技術としてのWeb

アプリケーションとしてのWeb

これまでアプリケーションとして色々足りない機能を足してきた(APIとかComponentsとか)

まだディスプレイ、キーボード、マウスの中に閉じているものが多い

Progressive Web Apps

Web Assembly

最近は言語がJSであるというのもなくなってきていて、果たしてWebとは何なのかという疑問がある

  • Googleの空間音響システム
  • Progressive Web Apps
  • Web Assembly etc..

メディアとしてのWeb

多くのユーザはスマホを使っている、デスクトップではなく

モバイルWebのUXが良くない→それのアンチテーゼがニュースキュレーションアプリ

GoogleのAMP(Accelerated Mobile Pages)

モバイルWebの課題が解決される仕組み

Googleにキャッシュする

AMP対応と表示される

ただ、推進への課題がある

e.g. CMSの対応が遅い、セマンティックのミスなどがある

基盤技術としてのWeb

  • HTTP/2
  • QUIC
  • SSL/TLS

モバイルアプリの最近↓

ストアに発見してもらうのも大変、インストールしてもらうのも大変

Webを再投資、再発明しなければならない

ブラウザ用のCPUを作るよ!Web Assemblyで

Mozilla Japan 清水 智公

Web Assemblyについて

VMを増やそうっていう取り組みがWeb Assembly

JSのVM・処理系(V8, SpiderMonkeyとか)以外に

それがWASM VM(拡張子は.wasm)

Web AssemblyがどんなVMを作るのか、そもそもなんで必要になったのかなど

unityのゲームがasm.jsでjsに変換される

作られたjsは50MBとか100MBになるw

標準的なライブラリとかが全部くっつくからめちゃでかくなる→ロードが遅い

ダウンロードも遅いし、実行までも時間がかかる

その時間を短くしたいのがWeb Assembly

文字列→(字句解析)→トークン列→(構文解析)→抽象構文木→(意味解析)→中間表現→(最適化・コード生成)→実行コード

jsは実行の後にコンパイルする(よく使うやつだけ)

asm.jsは先にコンパイルする

nativeはダウンロードの前にコンパイルされたやつを落とす

wasmは実行前にコンパイルするのは変わらないが、構文解析をブラウザに落とす前に済ませておくのが違い

parseは時間がかかるのでその分省略すると速くなるよって話

Web Assemblyは単なる構文解析の結果、実行するにはコンパイルが必要

手で書くものではない

変換手順(例)
  1. .c, .cppをemcc(ツール)で.asm.jsに変換→.asm.jsを.wastに変換して.wasmに変換
  2. もしくはclang/emccで.wasmに直接変換

cからhtmlが生成されるw

cとかc++をそのまま変換して使う

どうやってwebページに組み込むか?

jsの命令を叩いて読み込み

fetchで取って、Wasmっていうオブジェクトがいるのでそれを使って読み込む

CからJSの関数を呼ぶことも出来る

Cにインタフェースだけ定義されている場合

JSに中身が定義されているようなケース

ここまでのまとめ

  • ネイティブコードではない
  • 型付けされたスタックマシン、レジスタではない(サイズを小さくしたいから)
  • 連続なメモリモデル(パースとかのコストを下げたいから)
  • 抽象構文木(AST)のバイナリフォーマット
  • 構造化されたコントロールフローを定義
  • モジュールシステム

ソースを表示できる、読めるのはWeb Assemblyのポイント→難読化とかには使いづらい

ヒープもスタックも同じ領域にとられる

とにかくそのまま実行できるバイナリコードではない

ブラウザに新しいVM作って、命令セットがあるイメージ

Cとかで書けるのがいい

大規模なプログラムを書くためにできてる

JSの置き換えではない

現状の制限事項

  • asm.jsと同じことしか今できない = 数値演算しかできない
  • domのAPIを直接呼べない、JSの関数を呼ぶことになる
  • スレッドがない、シングル

予定されている機能

  • スレッド
  • 共有メモリ
  • ダイナミックリンク
  • 0コストの例外
  • 固定長のSIMD

これでWeb Assembly試してみよう

WASM Explorer

Service Worker Deep Dive

Google 保呂 毅

ここ1年のService Workerの動向まとめ

スライドを見よう

Webのグラフィックス

WebGL2.0

杉本 雅広

シーグラフ(SIGGRAPH)@アメリカにて、WebGL2.0がドライバテストをパス

WebGL2.0の実現味が増してきた

OpenGL ES 3.0相当のAPIを叩けるのがWeb GL 2.0

普段からWebGLをぺろぺろしてるおじさんじゃないとなかなか恩恵を受けづらいが、

three.jsなどのライブラリの、普段ぺろぺろしてるコントリビュータが

その恩恵をライブラリに反映してくれるだろう

そしてWebVR

比留間 和也

WebVRは仕様

WebVR自体の仕様は複雑なものはない、少ない

3つの情報を取得してAPIを使う

APIはデバイスやセンサーから情報を取得するのが主な仕事

3DはWebGLでコンテンツを作る

Is WebVR Ready?で対応状況を確認できる

Webアプリケーションにおける機械学習活用の基礎

Google 中井 悦司

A Neural Network Playgroundで遊べる

線形多項分類器

  • ハードマックス方式
  • ソフトマックス方式

畳み込みフィルター

本質的にはフォトショのフィルターといっしょ

分類に役立つ特徴を抽出するフィルターをいくつか使って

分類の精度を上げる

フィルターが抽出する特徴自体も学習させる

だからめっちゃ時間・リソースがかかる

今後の可能性

  • 学習済みモデルをベースにして、個別データでさらにモデルをチューニング→かっこよく言うと「転移学習」
  • クライアント上でリアルタイムな学習、ユーザに合わせて進化していく

モデルの学習と適用のプロセス

ソフトウェアの開発モデル(CI/CD)と似ている

既存モデルがあって、新規データで学習させて改訂版モデルを作成

テストが成功すれば既存モデルを置き換えるっていうことをやっている

このプロセスを回す定番ツールがいずれできるのでは。。。?

動画の学習

静止画と違って、ネットワークの組み方が変わる

リカーシブなんとかっていうらしい

1枚目のフレームの学習結果を2枚目のフレームとともにまたネットワークに突っ込むというイメージ

Web技術動向とブラウザベンダー戦略のこれから

Mozilla Japan 浅井 智也

スライドを見よう!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment