Pixel-perfect means every line in an icon lands exactly on a physical pixel boundary on screen. When a vector coordinate isn't a whole number — say, 12.5px — the browser has to smooth that in-between edge, blending gray into the neighboring pixels through anti-aliasing. The visible result is a line that looks slightly smudged.
That blur is quite noticeable on standard (1x) displays. To avoid it, an icon's stroke centerlines get snapped to .5px increments (for 1px-thick strokes) or whole pixels (for 2px strokes). Design tools often nudge overlapping shapes half a pixel out of alignment without anyone noticing, so it's worth zooming in after drawing to check for any blurred edges before shipping.
On high-density (retina, 2x/3x) displays each CSS pixel is made of several physical pixels, so the problem is far less visible. But it still matters for small assets that are still drawn at 1x — favicons being the classic case — or for projects that still need to support lower-density screens.
When to use
Check it whenever an icon renders small and fixed — favicons especially — or the project still supports lower-density screens. If everything targets 2x+ retina only, this drops in priority.