You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
先人たちが1年前に通った道で、いろいろいまさらかよって話なんですが。基本的に以下の記事読んだら分かります。要はGulpとかGruntといったモノ使わずにnpm run hogehogeでビルドしよーぜって話です。 task automation with npm run オレ的Gruntに対する最新の気持ち - from scratch Node - npm で依存もタスクも一元化する How to Use npm as a Build Tool // package.json "scripts": { "start": "npm run start-serve & npm run watch", "test": "stylestats public/files/css/maple.css", "start-serve": "browser-sync start --server publ
@yosuke_furukawaさんがtweetしていたサイトパフォーマンスに関連する Gruntとgulp.js のタスク一覧です。確かによいまとめなので、メモしておきます。 GruntとGulpには、画像の最適化、HTML/CSS/JavaScriptファイルの結合 & 圧縮をするタスクがあるので、まずそちらをベースラインとして利用されたし。 1) 画像ファイルの圧縮 & 最適化 webページは平均1.5MBで画像ファイルが多くを占める。モバイルで160KBの画像ファイルを追加すると直帰率が12%悪化すえるというEtsyのデータがあり。 Grunt grunt-contrib-imagemin grunt-imageoptim (OSXのみ) 二つのタスクのどちらを選ぶかは、こちらの比較表 で確認してください。 Gulp gulp-imagemin 3/4/2014時点ではImage
SVGスプライトにしたい理由 スプライト生成を自動化したい アイコンのちょっとした色変更などでPhotoshopを開くのがつらい アイコンフォントかSVGかData URIかビットマップか SVG 多色にも対応したいから 楽にレイアウトしたいから HTMLを汚したくないから モダンな感じにしたいから SVG画像呼び出しの選択肢 個別ファイル スプライト fragment identifiers方式(一般的なCSSスプライトと同じ) stacks方式(SVGでレイヤーを重ねて、その表示/非表示を指示する) インライン記述: HTML内にXML形式で記述するため、CSSやJavaScriptでの制御に対応 defs方式( defs タグで記述) symbols方式( symobls タグで記述) どれにするか 上記のなかだったら、インライン記述が良さ気かな…? 個別ファイルだとリクエスト増える
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く