64bit版Firefoxへの道のり（追記あり） - Mozilla Flux
祝10周年 2014年11月9日にFirefoxはバージョン1.0のリリースから10周年を迎えた。これを受けて10日以降、「忘れる忘却」ボタンの追加などユーザーのプライバシーに配慮したFirefox 33.1がリリースされ、Firefox AuroraがWeb開発者向けにリニューアルされて「Firefox for DevelopersFirefox Developer Edition」の名称で提供されるなど、さまざまなMozillaの企画が実行されていく。 10周年記念キャンペーンの一環として、Windowsユーザー向けに64bit版Firefoxのプレビューが提供されるとみられる。本記事では64bit版Firefoxの正式提供に向けた動きをまとめてみたい。 （14/11/10追記） 確定したブランド名を見落としていたので修正（Bug 1072181）。ボタン名もリリース版の表記に合わせた
Firefox を使ってみよう
Firefox ブラウザー Developer Edition ご愛用いただいているブラウザーが新しくなりました。自由なウェブを築くために必要とされる最新機能や高速パフォーマンス、開発ツールを、ぜひ入手してください。
CSS: Using every declaration just once - Make the Web Faster — Google Developers
OverviewPageSpeedAnalysisInsightsAboutMobile AnalysisInsights ExtensionInsights APIDocumentationGetting StartedPerformance TipsReferenceRelease NotesTerms of ServiceResourcesLibraries and SamplesAPIs ConsoleLibrariesRulesAvoid landing page redirectsAvoid pluginsConfigure the viewportEnable compressionImprove server response timeLeverage browser cachingMinify resourcesOptimize imagesOptimize CSS de
Private Presentation
Private content!This content has been marked as private by the uploader.
status.modern.IEの見方
2014年5月ぐらいにInternet Explorerの機能別の開発状況が掲載されるstatus.modern.IEが正式公開されました。 Launching status.modern.ie & Internet Explorer platform priorities - IEBlog - Site Home - MSDN Blogs Internet Explorer Web Platform Status and Roadmap - status.modern.IE このサイトでは以下の5つのステータスで機能別の開発状況が載っています。 Not currently planned : 今のところ予定なし Under Consideration : 実装を検討、調査中 In Development : 開発中 Preview Release : プレビューリリース版に実装済み IE
Antialiasing 101 | Articles | web.dev
Antialiasing 101 Stay organized with collections Save and categorize content based on your preferences. Introduction Antialiasing is something of an unsung hero in web graphics; it’s the reason we have clear text and smooth vector shapes on our screens. There are actually a couple of approaches to antialiasing used in browsers today which are most obvious when it comes to text rendering. When the
#perfmatters - Performance Tooling - Sept 2013
yes. your users hate spinners too! click next!
web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
How to create high-performance CSS animations | Articles | web.dev
This guide teaches you how to create high-performance CSS animations. See Why are some animations slow? to learn the theory behind these recommendations. Browser compatibility All of the CSS properties that this guide recommends have good cross-browser support. transform opacity will-change Move an element To move an element, use the translate or rotation keyword values of the transform property.
ブラウザで大きな画像の描画をキャッシュするプリレンダリング - Qiita
巨大な画像をスムーズに表示する素敵なバッドノウハウの共有です。 大きい画像を事前にプリロードしておくことは普通にやっていると思いますが、大きい画像ってのは描画コストも当然に大きいです。DOMに配置してから、ほんのわずかですがタイムラグが発生します。すばやく画像を切り替えるような演出だとチラついたりしちゃって興ざめですね。そういった時に有効なのがプリレンダリングです。 ブラウザにそんなものあるのかっていうと、たぶんないです。勝手にそう呼んでるだけで、ようするに事前に画像を描画させてキャッシュしておこうということです。 体型は変わりません デモ ごく普通にプリロードのみ実装したものから。 プリレンダリングなし さっそうとモデルウォークしてるミクさんがいますね。さすが40コマ、ぬるぬるです。 ちなみに画像サイズは 450×450 なので、高さ 18450px の画像てことになりますね。おそろしい
The Web Platform: Browser technologies
Include single-engine specifications • To re-sort, click on any heading. SpecificationRepoDocsTestsEnginesCategory
VelocityConf: Rendering Performance Case Studies
Jank-free rendering performance has been shown to positively affect user engagement and user experience in a number large sites, yet remains an area many developers are unaware of how to diagnose or optimize for. To highlight how widespread rendering is a performance issue, we’re going to walk through case studies of Flickr, Pinterest, Google+, Twitter Bootstrap and more. Learn about common paint
CSS Triggers List - What Kind of Changes You Can Make
• Layout • Paint • Composite align-content Changing align-content alters the geometry of the element. That means that it may affect the position or size of other elements on the page, both of which require the browser to perform layout operations. Once those layout operations have completed any damaged pixels will need to be painted and the page must then be composited together. align-items Changi
Webページレンダリングについて知っておくべきこと: ピクセルは高コスト | POSTD
Web開発者として、ユーザの画面表示にピクセルがどのように関わるのかということは知っておくべきでしょう。知ることが目的なわけではなく、効率性のため画面表示を最適化する際にその知識が必要となってくるからです。 先日、「 フロントエンド開発者がWebページレンダリングで知っておくべきこと 」を読んだのですが、重要なポイントを外してしまっている印象を受けました。その記事で強調されていたのは、CSSセレクタのマッチング、レイアウト（FirefoxのようなGeckoベースのブラウザではリフロー）、そして レイアウトスラッシング という名でも知られる強制同期レイアウトに注意することです。確かに、これらは気をつけたほうがいいことだとは思いますが、私としては、ページレンダリングについて開発者が知っておくべきことをその記事ですべてカバーしていたとは思えません。大抵の場合、Web開発者は60fpsの表示を目指
Aerotwist - Pixels are expensive
How pixels get onto your users' screens is something you should know about. Not for the sake of knowing, but because in order to be effective as a modern web developer you're going to need to optimize for it. Last updated: 3 Jul 2014 Est. Read Time: 9 min Share this: Twitter Tagged: #perfmatters The other day I was reading through What Every Frontend Developer Should Know About Webpage Rendering a
Components - TJ Holowaychuk
With the advent of numerous client-side JavaScript package managers, I wanted to write up some of my thoughts about the fragmentation that we have today, and some ways that I think we could really improve delivering packages a community. Keep in mind that these are only my opinions, everyone has done a great job and there’s a lot of cool work going on out there. I think there are a few problems wi
モダンブラウザでコーディングするときの詰んでるバグ＆仕様と解決方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、LIGフィリピン支社代表のせいとです。いきなりですが皆さん、コーディング中にブラウザのバグや仕様にぶつかって、解決策をググってみてもヒットせず「ヤバい、詰んだ」的な状況になったことはありませんでしょうか。 古いバージョンのIEとかAndroidならネットに蓄積された情報がけっこうあるのですが、ChromeやIE11で動作がおかしくなると、比較的情報が少ないので困ります。 今回はそんな「モダンブラウザ（PC）」に焦点を当てて、コーディングのレアケースなトラブル5つと、実際にそれをどう回避したのかをご紹介します。 <a>タグに「position:absolute」を指定してホバー時にスタイルを変えようとすると中のテキストが一瞬太字になる（Safari） 以前、「position:absolute」を使ってホバーすると動くボタンを実装したことがあったのですが、safariで見るとホバ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブラウザレンダリング 最適化テクニック
2014-09-09-performance-in-css-hikalab-yuya-saito.pdf
CSS: a rapidly changing world