The easiest way to manage this will be to edit the icons themselves.
One factor I can see is that the icon set we use by default, FontAwesome, doesn’t include dimensions within their SVG files while Google does.
FontAwesome’s opening tag:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
Google’s (note the height and width added around the viewBox)
<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48">
So I’d try removing the height/width from Google’s icons… the resulting spritesheet looks like this:
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="google-bars" viewBox="0 96 960 960" ><path d="M150 816q-12.75 0-21.375-8.675-8.625-8.676-8.625-21.5 0-12.825 8.625-21.325T150 756h660q12.75 0 21.375 8.675 8.625 8.676 8.625 21.5 0 12.825-8.625 21.325T810 816H150Zm0-210q-12.75 0-21.375-8.675-8.625-8.676-8.625-21.5 0-12.825 8.625-21.325T150 546h660q12.75 0 21.375 8.675 8.625 8.676 8.625 21.5 0 12.825-8.625 21.325T810 606H150Zm0-210q-12.75 0-21.375-8.675-8.625-8.676-8.625-21.5 0-12.825 8.625-21.325T150 336h660q12.75 0 21.375 8.675 8.625 8.676 8.625 21.5 0 12.825-8.625 21.325T810 396H150Z"/></symbol>
</svg>
and the result is aligned 
