手動でWebRTCの通信をつなげよう ーWebRTC入門2016
こんにちは！ がねこまさしです。2014年に連載した「WebRTCを使ってみよう！」シリーズを、2016年6月の最新情報に基づき、内容をアップデートして改めてお届けしています。1回目はカメラにアクセスしてみました。2回目となる今回は、WebRTCの通信の仕組みを実感するために、「手動」でP2P通信をつなげてみましょう。 WebRTCの通信はどうなっているの？ WebRTCでは、映像/音声/アプリケーションデータなどをリアルタイムにブラウザ間で送受信することができます。それをつかさどるのが「RTCPeerConnection」です。 RTCPeerConnectionには3つの特徴があります。 Peer-to-Peer(P2P)の通信 → ブラウザとブラウザの間で直接通信する UDP/IPを使用 → TCP/IPのようにパケットの到着は保障しないが、オーバーヘッドが少ない PeerとPeer
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI 川田寛（ピクシブ株式会社） こんにちは、ふろしきです！ 私はHTML5 Experts.jpで、過去2年ほどGoogle I/Oの情報を発信し、Web技術の変化についてお伝えしてきました。振り返るとGoogleは、2014年にモバイルWebの提唱と技術要素の拡大を図り、2015年からは「RAIL（モバイルWebが目指すべきパフォーマンス指標）」や「Progressive Web Apps（アプリのように振る舞うWeb）」といった、モバイルとの親和性が高いWebを作り出すための”考え方”を推し進めました。今年2016年は、さらにそれを踏み込んでいったという感じがします。 今回のI/Oで取り上げるのもそのひとつ。毎度お馴染みGoogle Developer A
Googleが新たに提唱するProgressive Web Appsの新たな開発パターン「PRPL」とは？
Googleが新たに提唱するProgressive Web Appsの新たな開発パターン「PRPL」とは？ 小松 健作（NTTコミュニケーションズ） 「Google I/O 2016」では、これからのWebアプリ開発パターンとして提唱しているPWApps(Progressive Web Apps）について多くのプレゼンテーションがなされました。 PWAppsとは、最新のWeb技術を有効に活用し、漸進的（Progressive）に高度なユーザー体験を提供しようとする概念です。このPWAppsの概念を具体化する一つの手法として、「PRPL」（パープル）と名付けられた開発・提供パターンが提案されました。本稿ではこのPRPLを解説するとともに、その有効性や課題点を考察します。 本稿は、Google I/O 2016の二つのセッションに関する、解説記事です。 Polymer and Progress
WebRTC DataChannelの活用方法とその可能性─WebRTC Conference Japan
本記事では、WebRTC Conference Japanのセッションの1つである、「WebRTC DataChannelの活用方法とその可能性」について紹介する。講演者は、Mist Technologies株式会社CEO・田中晋太朗氏だ。 セッション内容は、大きく以下の2点である。 WebRTC DataChannelのおさらい ひねりのある使い方事例紹介 以下でそれぞれの内容について紹介する。（発表資料全体はこちらから） WebRTC DataChannelのおさらい 概要 DataChannelは、サーバを介さずにテキストやバイナリデータを送ることができる。特にバイナリデータが重要で、ArrayBuffer、ArrayBufferView、Blob、Stringを送信可能だ。 注意点として、CreateOfferでSDPを作成する前に、createDataChannelしておく必要が
HTML5でWebRTCを使ってみよう！「カメラを使ってみよう」編
こんにちは！ がねこまさしです。これから数回に渡って、WebRTCについて書かせていただきます。 内容は2013年10月にNode学園祭2013で発表したプレゼンを、再構成したものになる予定です。 ※こちらの記事は2014年に書かれました。2016年6月現在のアップデート記事がありますので、そちらもご参照ください。 WebRTCとは？ WebRTCとは”Web Real-Time Communication”の略で、Webブラウザ上でビデオ/オーディオの通信や、データ通信を行うための規格です。HTML5で新しく策定されたもので、複数の技術の連携で成り立っています。 ちなみに策定には複数の団体が絡んでいています。 API → WWW ビデオ/オーディオのコーデック → IETF WebRTCで何ができるの？ WebRTCには大きく分けて2つの要素があります。 カメラ、マイクといったメディアへ
組込み+HTML5の持つ可能性は？「HTML5 run anywhere」HTML5 Conference2013
組込み+HTML5の持つ可能性は？「HTML5 run anywhere」HTML5 Conference2013 馬場 美由紀（HTML5 Experts.jp編集部） 2013年11月30日に開催された「HTML5 Conference2013」において行われた数々のセッション。株式会社ACCESSの長野宏輔氏が「組込み+HTML5」の持つ可能性について語った「HTML5 run anywhere」をレポートする。 車載機器、ハイブリッドキャストなど HTML5×組込はすでに実現 実は、HTML5の技術が利用されるシーンは、PCやスマホ向け以外にも広がってきている。例えば、テレビやカーナビ、ゲーム機、デジタルサイネージ、家電のUIなど。つまり組込向けにもHTML5のコンテンツが開発できる環境が、ここ数年で着実に用意されてきているのだ。 長野氏によると、例えば車載機器からの情報取得に関す
「今どきのGruntを使ったフロントエンド開発（HTML/CSS編）」HTML5 Conference 2013 セッションレポート
「今どきのGruntを使ったフロントエンド開発（HTML/CSS編）」HTML5 Conference 2013 セッションレポート 出口 達也 2013年11月30日（土）に開催された「HTML5 Conference 2013」の、株式会社サイバーエージェント・石本光司さんによるセッション「今どきのGruntを使ったフロントエンド開発（HTML/CSS編）」の内容をご紹介します。 なお、セッションのターゲットはGruntを使ったことのないHTML/CSSコーダーやWebデザイナーさんです。 なぜGruntを使うのか Gruntとは、JavaScriptで書いたタスクを実行してくれるアプリケーション（JavaScript Task Runner）です。 Webアプリケーションの開発が複雑になってきて、CoffeeScript、Sassなどのコンパイルが必要な技術を使うことが多くなってきた
「進化を続ける JavaScript ～次世代言語のステキな機能と高速化の行方～」HTML5 Conference 2013 セッションレポート
「進化を続ける JavaScript ～次世代言語のステキな機能と高速化の行方～」HTML5 Conference 2013 セッションレポート 吉田 啓二 2013年11月30日（土）に開催された「HTML5 Conference 2013」の、Mozilla Japan浅井智也さんによるセッション「進化を続ける JavaScript ～次世代言語のステキな機能と高速化の行方～」のセッション内容をご紹介します。 JavaScriptの課題と改良への動き 現在のJavaScriptには、次のような課題があります。 高速化がなかなかできない クラス、モジュールがない プロトタイプベースであるため、普段Javaなどでクラスを使っている人にとって、メソッド定義や継承がわかりにくい メソッドとして呼び出したときはthisがそのメソッドのオブジェクトになるが、間違って関数として呼び出すとthisがw
Bootstrap3超速レビュー！刷新されたグリッドシステムを理解しよう！
Bootstrap3超速レビュー！刷新されたグリッドシステムを理解しよう！ 白石 俊平（HTML5 Experts.jp編集長） 人気のCSSフレームワーク「Bootstrap」のバージョン3が正式にリリースされました。この記事では早速Bootstrap3をレビューし、特にグリッドシステムを掘り下げて解説してみます。 フラットデザイン採用、フルレスポンシブ！ Bootstrap2からの変更点のリストは、公式のリリース文を参照してください。特に大きな変更点は以下のとおりです。 フラットデザインの採用 現在流行のフラットデザインを採用しました。ただこれは「流行りに乗った」のではなく、テーマの一つとして提供されているという位置付けのようです。 例えば以下は、Bootstrap3のボタングループです。 レスポンシブWebデザインの全面採用 以前までのBootstrapは、レスポンシブWebデザイン
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
