Content-Length: 257028 | pFad | http://b.hatena.ne.jp/mizdra/canvas/
DOMDOMタイムス#15: canvas-based renderingとa11y。いま、そしてこれから
DOMDOMタイムス#15: canvas-based renderingとa11y。いま、そしてこれから はい、DOMDOMタイムスです。知ってるよって？この挨拶は、まあ準備体操みたいなものなので。いつだって欠かさずやっていきます👶 さて、今日はcanvas-based renderingとa11yの話です。この前のJSConfセッションの最後のあたりで話したことと重複が大きいですが、面白がってくれる方が多かったので文章にしておこうと思いました。 (一応JSConfセッションの資料へのリンクも載せておきますね) canvas-based renderingの波 canvas-based renderingという言葉は、この記事では「canvasをゴリゴリに使ってwebコンテンツをレンダリングすること」ってくらいの意味で使います。通常のform要素やdiv要素ではなくて、canvas要素
キャンバスの最適化 - Web API | MDN
前のページ 次のページ <canvas> 要素は、ウェブで 2 次元グラフィックを描画するためにもっとも広く使用されているツールのひとつです。しかし、ウェブサイトやアプリがキャンバス API の限界付近まで使用するようになって、パフォーマンスが悪化するようになりました。この記事では、キャンバス要素の使用を最適化して、グラフィックを確実に改善するための提案を行います。
JavaScriptで任意のHTML要素をPicture-in-Pictureする
みなさんはPicture-in-Picture(PiP)という機能を使ったことがありますか。PiPは動画コンテンツなどを浮遊する小窓に表示する機能です。小窓はウィンドウの外側を自由に移動できます。 デスクトップが賑やかになりがちなPCでもPiPは大活躍なのですが、特にスマートフォンにおいては数少ない「ウィンドウ」機能になります。Androidはもちろん、iOS14も対応したことで話題になりました。 これによってスマホ一台あれば、ソシャゲの公式生放送を見ながらソシャゲのイベントを周回する地獄のような行為が可能になりました。 利用者という視点から見ると非常に便利なのですが、開発者から見ると動画しか表示できないのはなかなか使い所が難しくなります。そこで、この機能を使って好きな情報を表示できないか実験してみました。 PiP機能の対応環境 Chrome 70 Firefox 71（制限付き） mac
Tighter limit for canvas memory use on iOS · WebKit/webkit@5d5b478 · GitHub
Tighter limit for canvas memory use on iOS https://bugs.webkit.org/show_bug.cgi?id=187279 <rdar://problem/38420562> Reviewed by Simon Fraser. Source/WebCore: We allowed 448MB of canvas buffer memory. This is still too much in some cases. Painting a large canvas may also requires several other temporary canvas sized buffers getting us easily over the process size limit. * html/HTMLCanvasElement.cpp
OffscreenCanvas—speed up your canvas operations with a web worker | Articles | web.dev
Canvas is a popular way of drawing all kinds of graphics on the screen and an entry point to the world of WebGL. It can be used to draw shapes, images, run animations, or even display and process video content. It is often used to create beautiful user experiences in media-rich web applications and online games. It is scriptable, which means that the content drawn on canvas can be created programm
Pixel-perfect rendering with devicePixelContentBox | Articles | web.dev
Background: CSS pixels, canvas pixels, and physical pixels While we often work with abstract units of length like em, % or vh, it all boils down to pixels. Whenever we specify the size or position of an element in CSS, the browser's layout engine will eventually convert that value to pixels (px). These are "CSS Pixels", which have a lot of history and only have a loose relationship with the pixels
Slow Code HATES him! Optimising a web app from 1 to 60fps
Slow Code HATES him! Optimising a web app from 1 to 60fps This post explores my experience optimising a web app through iterative improvement. The app uses Svelte, but you don’t need any prior experience, and most of what I discuss applies to any web app. It follows on from Embrace your Obsessions! so if you want to learn more about Minesweeper and the context of this post, give it a read. After m
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Fetched URL: http://b.hatena.ne.jp/mizdra/canvas/
Alternative Proxies:
Total Canvas Memory Use Exceeds The Maximum Limit
Is there any reason for using WebGL instead of 2D Canvas for 2D games/apps?
Fabric.js Javascript Canvas Library