タグ

ブラウザとhtml5に関するburavo46のブックマーク (3)

  • canvas要素の基本的な使い方まとめ

    Written by defghi1977@xboxLIVE.この文書は全てテキストエディタで作成しています.えーと,そりゃもうゴリゴリと. 文書はsvg要素の基的な使い方まとめの姉妹版として作成を開始した.canvas要素の仕様は現在進行中で色々と変化しているため,一筋縄で行かないが大方のapiについて書き上がったので公開する.なお,まだ使えない機能等満載だったり,内容に間違いがあっても中々検証することができないので,その部分を了承した上でご利用下さい… 更新履歴 2012/07/18 初版 1・canvas要素の概観 canvas要素とは canvas要素はhtml5で採用されたwebブラウザ上でグラフィックを描画するための機構であり,webページの機能性・視認性が重要視される昨今では,svg要素と並び重要な役割を果たしている.もともとapple社が自社製osの機能向上策として,同

  • JavaScriptでファイル操作!? File APIを使いこなそう

    連載目次 近年のWebアプリケーションでは、画像ファイルやテキスト・ファイル、Officeファイルのアップロードやダウンロードのやり取りが行われることが多くなってきている(例えば、Twitter上での画像ファイル共有やGoogleドキュメントでのOfficeファイルのアップロードなどがそれだ)。 HTML5では、ファイル操作に関するAPIとして「File API」が定義されたことで、ローカルのファイルをブラウザ上で直接、取り扱うことが可能となった。これによって、Webとローカルの違いをアプリケーションで意識しなければならない局面も少なくなる。 現在、File APIは以下の3種類の仕様が策定されている。

    JavaScriptでファイル操作!? File APIを使いこなそう
  • HTML5 CanvasとCSS3のスマホブラウザでの描画性能 - ICS MEDIA

    スマートフォンのブラウザでどの程度のグラフィック表現が可能なのか、性能が気になりませんか? 近年、HTML5を利用できる分野はウェブサイトのみならず、ゲームやSPA(シングルページアプリケーション)など多岐に渡っています。そこで、記事ではiOSやAndroidの新旧さまざまな端末を使ってパフォーマンスを検証。記事の前半では描画性能を、後半ではJavaScriptの計算性能を測定しています。 描画性能の検証ビデオをご覧ください さまざまな端末を使って、描画検証の様子を録画しました。この80秒の動画では画像のオブジェクトの表示可能な個数を測定しています。ビデオの後半が見どころで、iPhone 5のパフォーマンスが良すぎてビデオを早送りするほどスコアがでるまで時間がかかっています。 さまざまな端末のスコアを測定しました 次の表に、2012年までに発売されたスマートフォンのスコアを掲載しました。

    HTML5 CanvasとCSS3のスマホブラウザでの描画性能 - ICS MEDIA
  • 1