序文
多くの小規模インタビューパートナーは、フロントエンドのパフォーマンスの最適化を経験する最も効果的なの間で画像の最適化と、最も頻繁にCSSスプライトで、プロジェクトを実行する前に、私と一緒にスプライトの以下の経験（ステップピット）を説明するかもしれません。
概念と原則
コンセプト：CSS-スプライト、スプライトと呼ばれる、画像は分割またはCSS CSSスプライトです。
原理：一の画面に複数の画像を融合し、その後自然にロード時間を低減するHTTPリクエストの数を減らす、CSSの背景位置を介して画像サイズ指定された場所を取ります。
使用
プロジェクトは、これらの表現が必要な場合は、スプライトと14枚の画像を、必要としないCSSスプライト場合、ただ一つに融合しました。芸術を探すために芸術家を見つけるために芸術家を取得するには、あなたがたが行うスプライト私に聞かないでください。
まあ、技術ではない場合、私はプロジェクトは、フラッシュのスプライト合成によって、合成輸出は、彼があなたのマップと文書を与える終えない前に、この数字は座標系に相当し、スプライト上のファイルに語りました水平および垂直の始点の座標と各パネルのサイズ。
幅、高さを取って、CSSの背景位置によって始点座標を選択します。
I私はすべてが個別に各図を判明置くので、プロセスでスプライトをやって、私は一つの大きな絵の中にこれらのパネルを置くことに疑問は、全体像の大きさが小さくなるだろうと思いましたサイズを追加し、スプライトの比較。結果：少し小さな変更が、増加していません。
バー罰金：スプライトはスプライトが方法ではありません使用することはできません前よりも大きくなるだろうと。
結論：リクエストの数を減らし、画像サイズを最適化するためのリソースを持っていないに加えて、パフォーマンスの最適化にスプライト、増加の大きさは、本当に何もほとんど影響はありません。
欠点（ステップピット）
ここでは主なピットは（死の笑顔を）持って来るのプロダクトマネージャーである、プロジェクト完成品は少し絵を感じるのは、絵の一部スプライトうちに登場し、その後、別のに置き換え作業は、すべて使用されていませんしません。
バー罰金：それはまだスプライトを再実行していない理由の絵を変更します。
私はまた、写真3スプライトの数百人を描いたプロジェクトをしなければなりませんでした。毎回画像の変更がある場合は再行うと場所（デッド笑顔を）再入力してください。
短所：
1.管理するために行う助長されていません、可能性の高い原因冗長に変更したとき。
2.画像は、入力位置の重いワークロードのサイズが大きすぎます。
要約：
在做项目时用到精灵图的时候一定要把大概率不会修改的图片绘制成一张精灵图，或者归类，把类型一样的、或者宽高大小差不多的放在一张图中。千万不要把成千上百的所有的图绘制在一张，
一定要分类，减少请求次数是真，但千万不要为了减少那么几张，整出一个非常庞大的精灵图。我一般都是一个类放一张图中，按功能、需求、宽高都可以分类。 之前的一个项目是购物界面,
我将物品的类型还有大物件、小物件进行分类，整个项目大概需要300张吧。我分为了大概5张精灵图。（精灵图用background-position输入的时候真的累，数量少还可以，数量多心态爆炸）。