画像の最適化をCLIだけで行うgrunt-imageを作った | 1000ch.net
GUI要らずを目指して Webにおける画像については以前記事にしましたが、 そのフローをより良くするべく最近gruntのモジュールを作ったのでその話を。 前置き 私は弊社サービスのパフォーマンス改善を業務としてしています。 何がボトルネックになっているかは各プロジェクトでまちまちですが、 共通しているのが 「とにかく画像が多い」 というところ。 どのサービスもペイロードサイズの80%程を画像が占めているんですね。 画像の最適化を忘れるだけで（例えば）100KBとか平気で増えるので、 これではCSSやJavaScriptのファイルサイズを減らしても本末転倒です。 （もちろんCSSもJavaScriptも結合と圧縮は非常に重要です。） 各種最適化ツール GUIだと以下の3つが有名で優秀です。 ImageAlpha - フリーソフト。24bitのPNGの8bitコンバートを行う。256色~2色ま
SMACSSが日本語に翻訳されました | 1000ch.net
2013/07/03 SMACSSが日本語に翻訳されました @cssradar氏翻訳によるSMACSSの日本語書籍が発売されました。 Scalable and Modular Architecture for CSS(日本語訳サイト) Scalable and Modular Architecture for CSS 書籍もしくは印刷本で購入することが可能です。 そもそもSMACSSとは Scalable and Modular Architecture for CSS Jonathan Snook氏が提唱するCSSのスタイルガイドです。 書籍内の内容の引用はできませんが、サイトに掲載されている文章を引用させて頂きました。 SMACSSはデザインプロセスを分析するための手法であり、厳格なフレームワークを柔軟な思考過程とする手法だ。 そしてCSSを使ったウェブサイトの開発に対する一貫
Gruntの概要と導入手順とメリット | 1000ch.net
2012/12/08 Gruntとは grunt: a task-based command line build tool for JavaScript projects もはや説明不要の可能性もありますが、 gruntがgrunt-cliへの移行(?)をしたこともあり、まとめてみました。 コマンドラインで使用するビルドタスクのツールです。 js(ほぼjson)の設定ファイル上に、concatやminifyといったようなタスクを定義し、 コマンドラインから実行します。言葉だけだとイメージ湧きにくいと思いますので、 使ってもらうのが一番と言い張って導入手順の説明に入ります。 npmからgrunt-cliをインストールする （nodeとnpmはインストール済み・・・よね？） npm install -g grunt-cli これで核となるCLIのインストールは完了です。 ターミ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
