記事情報殿堂入り企業

総行数57,000の巨大CSS群をLessに書き換えた軌跡

総行数57,000の巨大CSS群をLessに書き換えた軌跡

こんにちは!フロントエンド闇祓いの Kuniwak です。この投稿はmixiグループ Advent Calendar 2015の20日目の記事です。今年の9月に、スマートフォン Web ブラウザ版 mixi「mixi Touch」の巨大 CSS を Less (CSS プリプロセッサー)でビルドする環境へと移行しました。 書き換えた CSS の行数は、なんと...

更新日: 2015-12-20
記事の見出し
  • 総行数57,000の巨大CSS群をLessに書き換えた軌跡
  • 背景
  • 問題1: 非 Webkit ベースのブラウザーを考慮していない
  • 問題2: -webkit- つきのプロパティが標準になったときの書き換えが大変
  • 問題3: -webkit- つきのプロパティが非標準になったときの書き換えが大変
  • 問題への対処の軌跡
  • 救世主 Autoprefixer
  • CSS:fixme で Autporefixer の下ごしらえ
  • Less 導入
  • -webkit-box との格闘
  • Less 化における QC への技術的支援
  • 後日談
  • まとめ
  • 宣伝
テックブログ情報
総行数57,000の巨大CSS群をLessに書き換えた軌跡
ブログmixi engineer blog
ブログ概要ミクシィ・グループで、実際に開発に携わっているエンジニア達が執筆している公式ブログです。
QiitaQiita::mixi
会社名株式会社ミクシィ
会社概要SNSの『mixi』やスマホゲームの『モンスターストライク』を運営しています
上場情報Yahoo!ファイナンス