ウェブページを1秒台で表示させる原理と方法 | Philosophy Guides
可能な限り最新の情報を反映していますが、追いつけていないこともあります。本サイトに採用していても、記事に反映できていない設定もあります。ページのソースを読んでいただくと、参考になる箇所があるかもしれません。 ウェブページの高速化に関するテクニックは、ネットで検索すれば簡単に見つけることができます。優れた情報も数多くありますが、｢CSSとJavaScriptはminify（ミニファイ）しておけばOK！」のような都市伝説も少なくありません。 そこで、ここでは本サイトのデザインリニューアル時に施した対策をもとに、一歩進んだウェブページの高速化の方法と、それを支える原理について、できる限り分かりやすく説明したいと思います。フロントエンジニアやデザイナーの方からすれば「んなもん知っとるわ！」な情報なのかもしれませんが、都市伝説を駆逐すべく、私なりの仕方で解説（≒加勢）したいと思います。 初めに結果を
Let's talk about Web Performance — Pony Foo
For the past few months I’ve been speaking at conferences about web performance. Unfortunately, none of those awesome conferences have published their talk videos just yet. I figured I’d publish a write up about the talk, the things I’ve learned since I started speaking about these things, and the key take-aways from my talk. The presentation (you can find the slides online here) is split into thr
はてなブログにおけるページ表示速度改善の取り組みについて - Hatena Developer Blog
こんにちは、id:hakobe932です。はてなブログではユーザ体験の改善のために、ページ表示速度を向上させるための様々な取り組みを行っています。このエントリーでは、はてなブログで行っている、ブラウザキャッシュの活用、JavaScriptのページ最下部での読み込み、JavaScriptの圧縮、という3つの取り組みについて解説します。 ブラウザキャッシュの活用 同じ内容のJavaScriptやCSSを、ページを表示するたびにダウンロードすると、余分なHTTPリクエストが発生しますし、読み込み時間がかかります。 ブラウザのキャッシュを利用できれば、余分なリクエストを減らすことができます。はてなブログでは、なるべく長い間ブラウザにキャッシュを保存するために、JavaScriptなどの一部の種類のファイルのレスポンスに、以下のようなヘッダを指定しています。 $ curl -I http://hat
さくらのVPSでNode.jsを設定してみた – 水玉製作所
なにかと話題のNode.js。FlashやCreateJSなどのインタラクティブコンテンツと連動させたら、面白そう！ということで触ってみたのですが、いざインターネットで公開するとなると、多くのレンタルサーバー上では使えないことがわかりました。 root権限が必要なのです。 そこで、SAKURA Internetの「さくらのVPS」を契約して、設定してみました。 今回はインディゴデザインの五十嵐さんに無理を言って教えてもらいました。 五十嵐さん、ありがとうございました！ http://www.idw.jp/ 以下、習ったことのメモです。 Node.js自体の説明はしません。 主に自分向けのメモなので、第三者からするとわかりにくいとは思いますが、ご容赦ください。 アカウント情報 さくらのVPSを契約して、次のようなアカウントが発行されたとします。 [サーバ基本情報] IPアドレス：133.24
tmtr.log ｜ さくらのレンタルサーバ（スタンダード）にnode.jsをインストールしてみた
node.jsを試してみたくなったので、今借りているさくらのレンタルサーバ（スタンダード）にインストールしてみた。ごちゃごちゃ手間取ったので、インストールまでの作業過程をまとめてみます。 共用サーバなのでもちろんroot権限なんてないので、root権限なしで行えるという Install node.js without using sudo | Nurture your inner geek の記事を参考にしました。 （ただし、僕はcshを使っているので一部違う作業を行いました。） で、node.jsのソースコードの入手はnode.jsのサイトからDLしてFTPする／wgetしてもいいですが、ついでなのでgit経由で取ってこよう！ってことで、まずはgitのインストールです（えっ gitのインストールはこちらを参考にしました。 % cd ~ % mkdir local % mkdir git
ファイル編集したら即ブラウザー再読込させる LiveReloadX を作った
Web 開発してると、ソースを編集して、ブラウザーをリロードして、という作業の繰り返しになりがちだ。ソースを編集したら、自動でブラウザーをリロードしてくれるような夢のツールがあれば便利そうだ。 この分野では CodeKit や LiveReload などが有名なんだけど、もれなく有料だったり GUI だったりする。そこで、LiveReload のオープンソースな部分を参考にしつつ、コマンドラインで使える LiveReloadX というものを作ってみた。 特長はこんなところ。 Node.js を使ってるので Windows/Mac/Linux 問わずに動かせる 開発環境のブラウザーだけでなくスマートフォンのブラウザーもリロードできる 無料 インストール方法 インストールは超簡単！ Node.js をインストールする。 コマンドラインで npm install -g livereloadx を
Webサイトのパフォーマンスをチューニングする | PowerCMS ブログ
昨今、これまで以上にWebサイト(管理画面ではなく公開側のサイト)のハイパフォーマンス向上について様々な情報を目にするようになりました。 従前のWebサイトでは、サイトのチューニングは主にサーバーサイドで取り組む課題が多かったのですが、Ajaxの普及やスマホアプリなどJavaScriptの多用によって、クライアントサイドの高速化やHTMLソース上の工夫等による高速化がより重要になってきました。 そこで、今回はMT/PowerCMSの設定やテンプレート、プラグインによってWebサイトを高速化するためのTipsについてまとめてみます。 Minifierプラグイン https://github.com/alfasado/mt-plugin-minifier Minifierプラグインは、HTML, JavaScript, CSSコードの圧縮、画像のExif情報の削除、コンテンツのgzip圧縮等の
prototype.jsを10KBにする方法
2006-11-20T14:20:42+09:00 追記 「何者か」に攻撃を受けて、このページの内容が差し変わっていました。あわててバックアップファイルから復旧しました（「何者か」 = 酒……）。 prototype.jsを10KBにする方法の続き（.htaccessをスマートに使う） : 亜細亜ノ蛾 に続きを書きました。合わせてどうぞ。 JavaScript ファイルを圧縮する 正真正銘、Prototype（“prototype-1.4.0.js”）を10キロバイト（10,453 bytes）に圧縮して、しかも（当たり前ながら）動作するようにする方法です。 ──と聞いて真っ先に思い浮かぶのが「各種JavaScriptファイル圧縮サービス」、という人も多いでしょう。 しかし、自分が試してみたところ、例えば/packer/で圧縮したJavaScriptファイルは上手く動作しませんでした（他は
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - zeman/perfmap: Front-end performance heatmap bookmarklet.
npm Status
通信帯域を調整できるgruntプラグインを紹介するよ - Qiita
デブハゲ
_level0 | Kayac Interactive Designer's Blog