静的サイトをとにかく高速化する話
自分のポートフォリオサイトをサンプルに、どのくらいの容量削減ができるのかを確認してみました。 jsおよびCSSは、サイトの表示に必要な要素を1ファイルにバンドルした状態です。 画像ファイルはjpegの圧縮率などによって最終的なサイズが大幅に変化するので、jsとCSSのサイズ変化のみを取り上げました。 Bootstrap + Font Awesomeのような重量級フレームワークを使用しても、十分に実用的な容量まで削減できました。これならスマホ+3G回線での表示も心配ありません。 手法 適用しやすさを順に手法を並べると、以下のようになります。 遅延する 圧縮する キャッシュする まとめて削る 遅延する サイト上にあるほとんどのリソースは、実際には後から読み込んでも問題なく動作します。 まず最小限の構成でサイトを表示させ、重いファイルは後から読み込みます。 javascriptの遅延読み込み h
Gulp.js入門 - コーディングを10倍速くする環境を作る方法まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
普通に使う分には全く困らないほどの数のプラグインがGulpにはあります。 Githubでのstar数からも明らかなように、GoogleのWenStarterKitでもGulpが採用されるなど、注目度はますます高くなっています。 Gruntとの比較 Gruntと比較してのメリット・デメリットは以下のようになります。 メリット Gruntより設定ファイルが記述しやすい StreamAPIを利用することでファイルを毎回書き出すGruntより高速でエコ デメリット 記述がよりNodeに近くなるため、複雑なことは敷居がやや高め プラグイン開発のためのドキュメントが少ない 今日のゴール Gulp.jsを使ってコーディング作業を10倍速くする！ そんな環境を作りたいと思います。 1. Node.jsをインストール まずはNode.jsをインストールしましょう。 Node.js http://nodejs
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
イマドキのコーダー環境構築2016
