身につけておきたいWebサイト高速化テクニック #4｜最適な画像書き出しの基本 | DevelopersIO
みなさんこんにちは、クラスメソッドWeb担当の野中です。 昨日行われたAdobe MAXの発表でFireworksの新機能開発が終了 *1だそうですね。びっくりです。 さて、前回の身につけておきたいWebサイト高速化テクニック #3｜画像形式の基礎知識では、画像の品質を保ちながらファイルサイズを抑えるためにそれぞれの画像形式の特性について紹介しました。 第3回でリクエスト数の削減について先に解説すると記載していますが、文章の構成を考えると画像の書き出しについて先に説明した方が流れとしてわかりやすいので順番を変更しています。 本題 今回はPhotoshopやIllustrator、Fireworksを使った最適な画像書き出しの基本的な手法について紹介したいと思います。 前回の記事で得た知識を前提に解説しますので、まだ前回の記事を読んでいない方は必ず読んでおいてください。 この記事の対象者 W
【HTML/CSS/JavaScript】ウェブアプリを速くするための28の方法(翻訳) – T2
【HTML/CSS/JavaScript】ウェブアプリを速くするための28の方法(翻訳) 3月 13, 2013 admin 読了: 約 24 分 フロントの技術について英語の記事をシェアされていて、気になったので理解を深めるために翻訳してみました。 英語の記事では、28から始まるのですがややこしいので、1はHTMLからはじめていきたいと思います。 DANGER!!!WARNING!!!はじめに 元記事はこちら ※間違った意図や誤訳をしている箇所が多々あると思いますが、その点ご了承くださいませ…。 初めてということでしょっぱい訳で、すみません…。 1. avoid inline code / インラインコードを避ける 1. <style></style> や <script></script> をHTMLに直接書く 2. <link rel="stylesheet" href="" />
ここから始めるモバイルパフォーマンス。手軽な画像最適化ツール7選 | DECONCEPTER
ユーザーがページ表示に待てるのは2秒までと言われている。WEBサイトパフォーマンス最適化の話は多数上がっており、画像サイズやJavaScript・CSSの最適化、HTML上の外部リソースの読み込み順序、CDNの利用、DNSルックアップを減らす、HTTPリクエストの数を減らす、コンポーネントを圧縮するなどなど対応し始めたらキリがない。 実際の案件でしっかり最適化を行えているWEB製作者の方は意外に少ないのではないだろうか。今回は最適化のコトハジメとしてまず手軽に誰でも行える画像最適化に使えるツールを挙げてみたいと思う。 ローカルアプリケーション ImageOptim（Mac向け） ドラッグアンドドロップだけでJPEGやPNGの余計なメタ情報を削ってサイズダウンしてくれるアプリ。オフラインでがっと使えるのがうれしいマストツールだ。 ImageOptim — make websites and
JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法
[対象: 中〜上級] 僕のブログではてブ数がいちばん多いのはウェブページを高速化するTIPSを解説した記事です（まだ読んでない人はぜひ読んでください！）。 その記事では高速化全般を扱っていましたが、今日の記事ではJavaScriptに的を絞って表示速度をスピードアップできる施策を6つ紹介します。 もともとはSearch Engine PeopleブログのOptimizing JavaScript for Better Web Performanceで説明されていたものです。 記事作者のJoydeep Deb（ジョイディープ・デブ）氏に僕のブログでの転載許可をもらえました (Thanks, Joydeep!)。 逐一の翻訳ではなく、書かれている内容をもとに僕の言葉で解説していきます。 1. HTTPリクエスト削減のためにJavaScriptファイルを1つに統合する ウェブページの表示を高速化
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Browser Diet - Cache Array Length · jsPerf