HTML5 Conference 2015 講演資料まとめ #html5j1月25日に開催された「HTML5 Conference 2015」の中継動画や講演資料をまとめました。 ※リンクミスや追加情報などありましたら、コメントまたは@unsoluble_sugarあてにお知らせいただけるとありがたいです オープニングセッション（10:00-10:50） 基調講演
Top Pens of 2014 on CodePen
{"__browser":{"country":"JP","device":"unknown_device","mobile":false,"name":"unknown browser","platform":"unknown_platform","version":"0"},"__constants":{},"__CPDATA":{"domain_iframe":"https://cdpn.io","environment":"production","host":"codepen.io","iframe_allow":"accelerometer *; ambient-light-sensor *; camera *; display-capture *; encrypted-media *; geolocation *; gyroscope *; microphone *; mid
WebRTCでキャスしよう！片方向リアルタイム映像配信を作ろう
こんにちは！がねこまさしです。「WebRTCを使ってみよう」シリーズの最新話をお送りします。今回は、簡易的な放送局を作ってみましょう。 片方向配信の特徴 WebRTCを使った音声通話、ビデオチャットのサンプルには、双方向のものが多く見られます。ライブラリもそれを前提とした作りのモノが多いようです。なので今回は、片方向配信を実際に動かしてみましょう。 片方向配信には、双方向通信とは異なる特徴があります。 視聴側はカメラやマイクといった機器が不要なので、参加のハードルが下がる Peer-to-Peerでもフルメッシュ構造にはならないので、より多くの人が同時に利用できる 特に同時接続数はは双方向では4～5人が実用範囲なのに対し、片方向では10～30人程度に対して1つのPCから配信できます。ちょっとした仲間内のイベントや、社内イベントであれば、十分にカバーできるのではないでしょうか？（社内で動かせ
恐怖のHTML5 ApplicationCache Poisoning
自己紹介 (SelfIntroduction) @kyo_ago ApplicationCache Poisoning歴1年3ヶ月の新米です。 (ApplicationCache Poisoning NEWBIE.)
第51回html5とか勉強会行った #html5j - pirosikick's diary
第51回 HTML5とか勉強会 - connpass パフォーマンスに関するWeb標準についてとか、Web Animation APIとかは知らなかったのでちゃんと追わないと。。。 Chrome Dev Toolsの使い方とか、やらねばやらねばと思いつつも、FluxとかRact.jsとか、 ものを作るために必要な技術の勉強を優先してしまっているので、 会社で勉強会開くとか無理やりでも時間作らないとなーと思いました。 以下、メモ ブラウザのパフォーマンスを限界まで高める、HTMLコーディングの考え方 ブラウザのパフォーマンスを限界まで高める HTMLコーディングの考え方 from Hiroshi Kawada ブラウザのパフォーマンスを限界まで高める HTMLコーディングの考え方 川田寛さん NTTコムウェア株式会社 @kawada_hiroshi HTML5expoerts.jpとかに書い
WebRTCにおけるNAT越えの課題へのアプローチ - 鈴木うどんの横須賀おもしろ生活
WebRTCにおけるNAT越えの課題へのアプローチ - Qiita に移転しました。
<script async>でJavaScriptの非同期読み込みを - fragmentary
JavaScriptファイルをスクリプトから非同期で読み込むパターンは古い、という話を目にしたのはもう半年前のこと。 言ったのはIlya Grigorik。月末のGoogle Japanでのイベント、月初のHTTP2ConferenceにくるWebパフォーマンス界のすごいひとですよ。 Script-injected "async scripts" considered harmful - igvita.com 件のパターンは、スクリプトで動的に script を生成して、そこに読み込みたいJavaScriptファイルをぶっこんで読み込むというもの。 <script> var script = document.createElement('script'); script.src = "//somehost.com/awesome-widget.js"; document.getEleme
SVGクリッピングマスクにチャレンジ！静止画像も動画も、SVGで切り抜こう！
2014年10月8日 SVG Webクリエイターボックスでちょこちょこ取り上げてきたSVG。今回は第四弾！SVGを使ったクリッピングマスクを紹介します。今までは画像に透過PNGを重ねてマスクを表現できましたが、高解像度ディスプレイに対応させたり、マスク自体に効果をつけるならSVGが便利かなーと思います。サムネイル画像にフレームをつけたり、デザインのアクセントとして使えるので、ぜひマスターしてくださいね！ ↑私が10年以上利用している会計ソフト！ SVGのクリッピングマスク基礎 1. 画像を用意 それではさっそく試してみましょう！まずは切り抜かれる画像を用意し、img タグで表示します。この時画像に mask というクラスを与えておきます。 <img class="mask" src="images/rose.jpg" alt="Rose"> 2. マスクの型を用意 Illustratorで
How to create high-performance CSS animations | Articles | web.dev
Move an element To move an element, use the translate or rotation keyword values of the transform property. For example, to slide an item into view, use translate. .animate { animation: slide-in 0.7s both; } @keyframes slide-in { 0% { transform: translateY(-1000px); } 100% { transform: translateY(0); } } Use rotate to rotate elements. The following example rotates an element 360 degrees. .animate
Construct 2 the HTML5 Game Maker - Scirra.com
Construct 3 Create stunning games in the worlds best 2D game engine
Chromecastで動くHTML5ベースのメディアストリーミングアプリを作るための基礎知識
意外と知られていないことですが、Chromecast対応アプリは、iPhoneアプリやAndroidアプリ同様に誰でも開発することができ、今多くの開発者から注目されていて、今後もその数が増えることが予想されます。 Web＆モバイル技術のSIを手掛けるオープンストリームでは、Chromecastデバイスの国内発売前からスマートフォンアプリ（iOS版およびAndroid版）の対応について技術検証を行い、詳細な技術ノウハウを獲得してきました。本連載では、その時に得た技術を基にChromecastアプリのシステム構成、開発環境、開発準備、メディアストリーミングアプリの開発方法について注意点を含めて解説していきます。Chromecast対応アプリを開発する参考にしてください。 初回は、Chromecastの概要とサンプルアプリを動作確認できるまでの開発手順を解説します。 Chromecastアプリの
HTML5 Cross Browser Polyfills
The No-Nonsense Guide to HTML5 Fallbacks So here we're collecting all the shims, fallbacks, and polyfills in order to implant HTML5 functionality in browsers that don't natively support them. The general idea is that: We, as developers, should be able to develop with the HTML5 APIs, and scripts can create the methods and objects that should exist. Developing in this future-proof way means as users
Building Interactive HTML5 Videos – Mozilla Hacks - the Web developer blog
The HTML5 <video> element makes embedding videos into your site as easy as embedding images. And since all major browsers support <video> since 2011, it’s also the most reliable way to get your moving pictures seen by people. A more recent addition to the HTML5 family is the <track> element. It’s a sub-element of <video>, intended to make the video timeline more accessible. Its main use case is ad
Js13kGames - HTML5 and JavaScript Game Development Competition in just 13 kilobytes
HTML5 and JavaScript Game Development Competition in just 13 kB js13kGames is a JavaScript coding competition for Web Game Developers running yearly since 2012. The fun part of the compo is the file size limit set to 13 kilobytes. The competition will start at 13:00 CEST, 13th August and end at 13:00 CEST, 13th September 2024. Theme will be announced on August 13th. Read GitHub's tips and tricks a
WebRTCの最新動向が満載！WebRTC Update（Google I/O 2014番外編）
WebRTCの最新動向が満載！WebRTC Update（Google I/O 2014番外編） がねこまさし（インフォコム株式会社） Google I/Oの後で Google I/Oの後に、技術者が集結したサンフランシスコで様々なイベントが開催されたようです。WebRTC関連として、Kranky Geek WebRTC Event というものがあり、そこでGoogleからWebRTC Updateと題した発表がありました。今回はその50分のセッション映像から、ハイライトをご紹介します。 掴みはcardboard 最初の掴みは、DataChannelで制御できるローバー（自走車）です。キーノートで配布されたcardboardに装着したAndroidでローバーの首を振ってカメラの向きを制御できます。カメラの映像は当然WebRTCで伝達され、cardborad越しに見ることができます。(3分4
ハイブリッドアプリの動作性能を飛躍的にアップさせるiOS 8の新ブラウザエンジンを検証する
新ブラウザエンジン「WKWebView」 iOS 8では、これまで用いられていたブラウザエンジンであるUIWebViewに加え、「WKWebView」という新しいエンジンが追加されました。WKWebViewはその実行速度、安定性、そして機能面でも、UIWebViewを大幅に向上しています。要するに、WKWebViewを用いるだけで、アプリの実行速度が大幅にアップするのです。 しかし、WKWebViewもUIWebViewも、ベースは同じWebKitエンジンです。また、PhoneGapやCordovaといったハイブリッドアプリ、iOS版Chromeなどのブラウザアプリには、例外なくUIWebViewが使われています。WKWebViewとUIWebViewがどう違うのでしょうか？ 筆者はこの疑問について、iOS 7のUIWebView、iOS 8のUIWebViewとWKWebViewを比較対
Webrtc最新動向
5. 目次 • 最新情報を収集するには？ • W3Cでの標準化動向 • 気になるトピックス – Chrome M34,M35リリース – iOS対応 – H.264対応 – ObejctRTCについて • カンファレンスなどの予定 – WebRTC Conference Atlanta 6. 最新情報を収集するには？ • 公開Google Group – discuss-webrtc • https://groups.google.com/forum/#!forum/discuss-webrtc • 最新情報をキャッチアップできる • 情報量が多い • すごく初歩的な話題からかなり高度な話題まで様々 • ウォッチするのは結構疲れます・・・ • Chromeに関係する情報が多い • iOS向けのWebRTCスタックについても結構議論されている – mozilla.dev.media • ht
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - hail2u/html-best-practices: For writing maintainable and scalable HTML documents
WebRTCの技術解説 公開版
Blog - LINE ENGINEERING