webpack+spritesmithでページの高速化
ページの表示を高速化しようとしたら手法はいろいろあるけどフロントエンドエンジニアができることのひとつに画像のスプライト化ってのがある。 たくさんの画像ファイルをサーバーへリクエストして表示ってのをやるとサーバーの負荷になる。 負荷になると応答が遅くなる。こういうことからリクエスト数を減らせば表示の高速化が見込まれたりするので少しでも快適にページを観てもらおうと思えばやったほうがいい。 https://compass-style.org/ で、ソシャゲーとか作ってるとアクセスは多いし負荷となる処理も多いのでスプライト化は必須ってことが多いんだけど以前はCompassを使ってやるのが一般的だった。 けどCompassがさすがに2年くらい放置（更新されない）されているので仕様がいろいろ古い感じがするし単純にメンテナンスされてないことに不安をがあったりするのでできれば使うのを避けたい。 そうなると
CSSのみとSass/SCSS、Lessに対応したレイアウト系CSSフレームワークについて調べて表にしてみた | DevelopersIO
みなさまこんにちわ。 Webサイト高速化やSCSSの連載を書いている野中です。 そういえばGoogle Readerが終了するとのことでとても残念ですね。 読者のみなさまも次の引っ越し先ツール探しで忙しいところだと思います。 そこで、クラスメソッド開発ブログのRSSも忘れずに登録をお願いします。 とても更新頻度の高いブログということもあり、いろいろな切り口のRSSを用意しています。 本題 それでは本題ですが、レイアウト系のCSSフレームワークって色々ありますよね。 個人的にはHTML上のクラスにあまり意味のない文字列は入れたくないので使っていませんでした。HTMLも編集しなければならないので。 ふとSass/SCSSでExtendしたりMixinsで制御できるものであれば無駄なクラス指定を減らして可変でレスポンシブなグリッド制御ができるんじゃないか思って探してみたら色々とありました。 最初
PHPでcompass用のscssファイルをコンパイルするscssphp-compass
SassやCompassを使っていて、便利なんだけど面倒臭いなあと思うのが、いちいちコンパイルしたファイルをアップする作業ですね！ 僕が運用しているサーバは、gitが入っていたりいなかったり、共同作業のメンバーの環境でうまくgitが動かなかったり、そもそもWindows環境で動かしたときのエラーで心が折れていたり・・・・。 Ruby on Railsがメインの環境なら、sass、scssを置くだけで解決される問題が、他の環境でもどうにかならないかなあ・・・なんて思っていました。 サーバ側でコンパイルできればオールオーケー！っていう話で調べてみたら見つけたので紹介します！ Compass for scssphp https://github.com/leafo/scssphp-compass 使い方 Composerを使うため、若干ハードル高めですが、黒い画面をご用意ください！ 開発環境なり
CSS拡張メタ言語「SCSS(Sass)」と「LESS」の比較 - (DxD)∞
CSSを拡張するためのメタ言語として、代表的なものに「SCSS(Sass)」と「LESS」があります。今回、導入を検討するにあたり、両者を比較しました。 結果的には、「SCSS(Sass)」を導入することにしましたが、特に「SCSS(Sass)」を選択する決め手となった点に重点を置きつつ、両者の違いをまとめまてみました。 はじめに Webサイト、Webアプリケーションが大規模になるにつれて、CSSの設計・管理にもリソースを割かれるようになります。CSSのモジュール化、コンポーネント化による再利用性を考えたとき、現状のCSSを取り巻く状況は十分とは言えません。 一つの選択肢としてあがるのが「Blueprint」や「960 Glid System」等のCSSフレームワークの利用ですが、その再利用性と構造・表現の分離度はトレードオフです。 そこで、CSSの利点を活かしつつ、再利用性を高めるために
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
