Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
HTML5 WebGLについて #TechLunch
Search
Livesense Inc.
PRO
April 23, 2014
Technology
0
74
HTML5 WebGLについて #TechLunch
2012/03/14(水) @ Livesense TechLunch
発表者:島田 喜裕
Livesense Inc.
PRO
April 23, 2014
Tweet
Share
More Decks by Livesense Inc.
See All by Livesense Inc.
27新卒_Webエンジニア職採用_会社説明資料
livesense
PRO
0
2.5k
株式会社リブセンス・転職会議 採用候補者様向け資料
livesense
PRO
0
53
株式会社リブセンス 会社説明資料(報道関係者様向け)
livesense
PRO
0
1.5k
データ基盤の負債解消のためのリプレイス
livesense
PRO
0
440
26新卒_総合職採用_会社説明資料
livesense
PRO
0
11k
株式会社リブセンス会社紹介資料 / Invent the next common.
livesense
PRO
1
38k
26新卒_Webエンジニア職採用_会社説明資料
livesense
PRO
1
13k
中途セールス職_会社説明資料
livesense
PRO
0
270
EM候補者向け転職会議説明資料
livesense
PRO
0
130
Other Decks in Technology
See All in Technology
AWSで始める実践Dagster入門
kitagawaz
1
750
会社紹介資料 / Sansan Company Profile
sansan33
PRO
6
380k
EncryptedSharedPreferences が deprecated になっちゃった!どうしよう! / Oh no! EncryptedSharedPreferences has been deprecated! What should I do?
yanzm
0
490
Snowflake Intelligenceにはこうやって立ち向かう!クラシルが考えるAI Readyなデータ基盤と活用のためのDataOps
gappy50
0
280
Create Ruby native extension gem with Go
sue445
0
130
エンジニアが主導できる組織づくり ー 製品と事業を進化させる体制へのシフト
ueokande
1
100
LLMを搭載したプロダクトの品質保証の模索と学び
qa
0
1.1k
スマートファクトリーの第一歩 〜AWSマネージドサービスで 実現する予知保全と生成AI活用まで
ganota
2
320
AIエージェントで90秒の広告動画を制作!台本・音声・映像・編集をつなぐAWS最新アーキテクチャの実践
nasuvitz
3
360
サラリーマンの小遣いで作るtoCサービス - Cloudflare Workersでスケールする開発戦略
shinaps
2
470
データ分析エージェント Socrates の育て方
na0
7
2.6k
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
cmusudakeisuke
1
280
Featured
See All Featured
Code Review Best Practice
trishagee
71
19k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Facilitating Awesome Meetings
lara
55
6.5k
The Pragmatic Product Professional
lauravandoore
36
6.9k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
930
Side Projects
sachag
455
43k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
Git: the NoSQL Database
bkeepers
PRO
431
66k
KATA
mclloyd
32
14k
How GitHub (no longer) Works
holman
315
140k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Transcript
HTML5 WebGLについて
WebGLとは? • ブラウザをプレステにしてしまう技術 • 2011年3月に1.0が勧告されたばかりの今一番 ホットな仕組み • OpenGLがWebGLのもとになっている
OpenGL • OpenGL グラフィックスを高速に描画するための専用ハード ウェアを使うためのAPI
GPU(Graphics Processing Unit) nVidiaのGPU
GPU nVidiaのGPU VGAカード
HTML5 HTML5では、これまで単に文章を構造化するのみ から、動画、オーディを扱えるようになった。 →クロスプラットホーム環境を実現
canvas HTML5のcanvas要素では3次元グラフィックスを描 画することができる。 • 2次元や3次元グラフィックスをプラグインなしに HTML上に直接描画することができる。 • 原理的にはどのような3次元グラフィックスも描 画することが可能。
WebGL • Webブラウザで3DCGが表示できる • Flash、SilverLight等のプラグイン不要 • 勝手にGPUを叩いてくれる • インターフェースはJavaScript 動作するブラウザ
• FireFox、Chrome、Safari、Opera • IEではIEWebGL、JebGL、ChromeFrameなどを 使うことで動作させることができる
WebGLの実行環境 • WebブラウザがWebGLに対応していること • PCに搭載されているグラフィックカードの OpenGLのバージョンが2.0以上である必要 (2012年2月現在) →古いPCでは対応してないのが現状 • スマートフォンなどでのWebGLの対応は現在
(2012年2月)準備中段階。 →一気にウェブブラウザ用3次元グラフィックスAPI の地位を築く!?
WebGLの問題 IEがWebGLとは反対の立場をとっている →「OpenGL」と「DirectX」はライバル ↓ DirectXはMS関連製品でしか動作しないため勝敗 は明らか!?
セキュリティーホール WebGLはその機能要件ゆえにセキュリティが危険 に晒される可能性がある 1. ハードウェアの機能がWeb側につつぬけ 2. Webの利用体験を確保するためにサードパー ティを放任しすぎている 3. DoS攻撃に対する不備
デモ • Flash、Unity、WebGLの動作を確認 • ジニーエフェクト • Google Labsが公開するBody • Google
Chrome専用のWebGLコンテンツ • プレゼンテーションをWebGLで加工 • Aquarium
まとめ • WebGLは扱いが難しい? • 仕様策定の行く末やブラウザ対応など課題はあ る • Web上でできることの幅が一段と広がる
次回 WebGL WebSockets WebWorkers WebStorage