タグ

関連タグで絞り込む (11)

タグの絞り込みを解除

*CSS3とパフォーマンスに関するyamadarのブックマーク (4)

  • フロントエンドチューニングの箇条殴り書き

    普段気をつけてるよリスト "モバイルで、WebViewとブラウザのコンパチで、特にセオリー化されていないデザインモジュールのなか、装飾画像もふんだんに使うぞ系サービス開発" の文脈における、パフォーマンス確保のため気をつけてるよリスト。 よく、パフォーマンス「向上」とか「確保」とか申しますが、メンテナンスコストなどと天秤にかけて、「必要十分」のラインを狙うのが重要だと思う次第。 画像リソース 画像リソースを揃えるときのセオリ。圧縮率とか最適化とか細かいチューニングはあれど、大雑把に下記を守る。そしてImage Optim（or 相当の処理）。 JPEGはプログレッシブで画質60くらい（オレ目安） PNGは差し支えない範囲で色数をきちんと削る 50px未満のサムネイルは@2.0xなリソースにしない 案外、Androidあわせの@1.5xや@1.0xでも大丈夫なことすらある GIFアニメを入れ

    フロントエンドチューニングの箇条殴り書き

  • Webアニメーションを高速化するために知っておくべき10のこと（後編）


    Webアニメーションを高速化するために知っておくべき10のこと︵後編︶ 斉藤 祐也︵株式会社リッチメディア︶ 前編から引き続き、後編でも最適化のために知っておきたいレンダリングプロセス、計測方法、そして最適化を妨げるよくあるアクシデントとその回避方法について紹介していきます。 アニメーションを高速化するために知っておきたいレンダリングプロセス ブラウザがどのようにウェブサイトを表示しているのかを知ることは、アニメーションだけに限らず、Webのパフォーマンス全体の高速化を行うために大切なステップです。 イスラエルの開発者であるTali Garsiel氏が公開した﹃How Browsers Work﹄は、HTML5 Rocksに転載され、複数の日本語訳も提供されている、ブラウザの内部動作を学ぶために読んでおきたいリソースの1つです。 そのリソースを参考に、レンダリングエンジンのメインフローにつ
    Webアニメーションを高速化するために知っておくべき10のこと（後編）
    yamadar
    yamadar 2013/09/28
    ブラウザ再描画のタイミングと重さを意識すること。再描画はDOMやCSSスタイルに変更があった時などに発生する。
    リンク

  • FOUT


    Flash of Unstyled Textの頭文字をとってFOUTと呼ばれる現象がある。FirefoxでWebフォントの読み込みが完了するまで別のフォントが使われる現象のことで、後にSafariやChrome、Internet Explorerで起こるようになった読み込みの完了まで空白になる現象のことも含めてFOUTと呼ぶことが多い(気がする)。このWebサイトでも起こっていて、それについて聞かれたのでさらっと書いてみる。 この現象の原因はCSSの処理やWebページのレンダリングと並行してWebフォントのHTTPリクエストが行われることにあるので、仕様と言って良い。起こらないようにするにはWebフォントの読み込みが終わるまで他の処理をブロックするとかしないといけないため、改善される可能性はあるけどまず直ることはない。日本のWebサイトではあまり起こらないように感じるのは、Webフォント自
    FOUT
    yamadar
    yamadar 2013/08/23
    webfontが読み込み完了するまで空白になったり別のフォントが使われる問題。
    リンク

  • 表示が速過ぎても、誰も文句は言いません～CSS Nite「表示速度最適化」レポート


    CSSNite LP, Disk 23﹁表示速度最適化﹂ 2012年6月30日、ベルサール九段下で﹁CSSNite LP, Disk 23﹂が開催されました。CSSNiteはWeb制作に関わる方のためのセミナーイベントで、マークアップエンジニアやデザイナーの方が多く参加しています。今回のテーマは﹁表示速度最適化﹂でした。 パフォーマンス計測の方法、画像の最適化、モバイル向け最適化、そしてフロントエンドからバックエンドまでを考慮した設計段階からの最適化と、幅広いながらとても密度の濃い内容でした。 自己満足で終わらないためのパフォーマンス計測 サイバーエージェントの石本 光司︵@t32k︶さんから﹁Measuring Web Performance - 自己満足で終わらないためのパフォーマンス計測 - ﹂というタイトルで、サイトの最適化を行う上で重要なパフォーマンスの計測手段や分析方法に
    表示が速過ぎても、誰も文句は言いません～CSS Nite「表示速度最適化」レポート
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.