CSSスプライトをやってみて思ったこと
ブラウザゲーや半ネイティブ半ブラウザみたいなゲームを作ってると、読み込みの速さが課題に上がることはよくあります（その分の予算や工数確保サれることは少ないですが）。
で、ならばと画像加工ソフト使って勝手にCSSスプライトやってみたのですが、やってみて色々と気がつくところがあったのでまとめます。
CSSスプライトって何？
こちらがよくまとまってます。ゲーム作ってる人は割りと馴染みのある手法だったり（ドット絵配布サイトとか見るとイメージつかみやすいかと）。
CSSスプライトの利点
- 複数の画像がまとまることでHTTPリクエストが減り、ページの読み込み速度が向上する
- 個々の画像サイズが小さかったりほぼ共通の色調の画像だった場合、ひとまとめにすることで個々の画像の合計よりファイルサイズが減ることが多い
- 画像ファイルが散らばらない（個人的に嬉しい）
画像ファイルが小さいと、データの転送にかかる時間より通信にかかるコストが出かかったりします。
またソシャゲは見た目や訴求の問題で特にかく画像パーツが多いので、どんなにディレクトリやファイル名工夫しても何がなんだかよくわからなくなることが多いのですが、それが多少なりとも解消されるのも嬉しい。
CSSスプライトの欠点
- 画像作るのがめんどくさい
- デザインの変更があった場合に大変
デザイナーさんに納品して貰う前に全体のページデザインを共有してもらいスプライト化できそうな部分は予めそのように作ってもらうことができればベストですが、まあできた試しがないので依頼し直すか自分で勝手に作るかの2択です。私は自分でちまちま作りました。
で、面倒くささが身にしみました。この面倒くささを補完するツールやサービスはあるのですそれを使えば多少はマシになるかもしれません。が、それとは別の問題もあります。
ソシャゲ特有？の問題点
更新頻度が高い、動的な要素が多い
ソシャゲはリリースしただけでは意味がなく、日々修正や改善の手が加えられていきます。先週と今週でページのデザインが一新、なんてこともありえます。
そんな時に画像をまとめてCSS書きなおしてーとかやってると死にます（リソースが十分あれば違うんでしょうけど）。
また、ユーザーの状態や時刻によって動的に切り替わる部分まで1枚の画像にまとめると不要なときには余計な容量読み込むことになるのであまり変わらない、なんてこともありえます（キャッシュを期待するのもありですが、端末ごとにキャッシュサイズが異なるのでAndroidだとびみょい）。
現状の方針
ここまで書いておいてなんですが無理をしないこと。これに尽きると思います。
- スプライトとしてまとめる画像は項目やパーツごと（いつでもその部分だけ捨てられるように）
- 動的な部分はすっぱり諦める（動的に切り替わる部分ほど目立たせたい部分だったりするので変更激しいですし）
可能な範囲で、日々の更新に支障がでないよう工夫して、けど速度を求める。このへんのバランス感覚を磨きながらちょっとずつ工夫するしかないですね、というオチ。
Android4.3（Nexus7）で文字入力してるといきなりGoogle検索が開いてうざい
いや、タイトルのママなんですが。
特にボタンも見当たらないのになんで立ち上がるんだと色々調べてたら、ホームボタンの長押しで起動するんですね、これ。
気づくかそんなもん。
なんでそんな人が誤操作しやすい場所にショートカット置くんだと思いましたが、よく考えると英字キーボードだとスペース入力ボタンなんですねここ。もうちょっとスワイプ入力ユーザーのこと考えて欲しかった。
とりあえずアプリの設定でGoogle検索を停止して一件落着。ホームに意味のない検索バーの残骸が残るのが目障りですが、まあ諦めます（これもどうよと思いますが）。
CODEPREPやってみた
無料でプログラミングが学習できるサービスが最近ちらほら増えてます
自分の中で「学習」という分野には強く興味があって、それをサービスとしてどうやって提供しているか興味シンシン。
で、今回はそんな中でCODEPREPってサービスを試してみて、今のところある学習項目全部終わったので感想をメモ。
CODEPREPってどんなサービス？
ブラウザ上で学習内容とエディタとビューワがセットになっていて、学んだことをその場で入力して出力内容を確かめながら学習をすすめるサービスです。
やってみてよかったこと
基礎を延々と繰り返すタイプではなく、HTMLとCSSを組み合わせるとこんなことができるんだよ、という表現のバリエーションをたくさん見せてくれるので復習にもなるし新しく覚えたことも多い。
とくに、表現のパターンなんて自分の中でどれだけのストックがあるかが重要（思いつけるほど天才ならいいんだけどね）なので、パターンを見せてくれるのはとても有りがたかった。そのままコードの一部を流用して仕事に活用できたこともあったし。
微妙だなと感じたこと
自分としては勉強にもなってためにもなったんだけど、「初学者が基礎を学ぶ」サービスとして見ると、
- 範囲がやたら広い
- ○○がしたいという明確な目的のある人か、全部を網羅的にやりたい人以外には何を最初にやればいいか、それが終わったら次は何を選べばいいのかがわかりにくい
- 省略してる部分が多い（Javascript系は特に）
とくに省略してる部分がやっかいで、いざ自分で再現してみようと一から作業してみようとするとそこでつまずくことになるかなぁと。しかし、長ったらしいと多分みんなそれはそれで躓くんだよね。難しい……。
