<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <defs>
        <linearGradient id="gradient1f" y2="100" xlink:href="#gradient1e"/>
        <linearGradient id="gradient1e" x1="0" xlink:href="#gradient1d"/>
        <linearGradient id="gradient1d" y1="100" xlink:href="#gradient1c"/> 
        <radialGradient id="gradient1c" xlink:href="#gradient1b">
            <stop offset="0" stop-color="red"/>
            <stop offset="1" stop-color="blue"/>
        </radialGradient>
        <linearGradient id="gradient1b" x2="100" xlink:href="#gradient1a"/>
        <linearGradient id="gradient1a" gradientUnits="userSpaceOnUse"/>

        <linearGradient id="gradient1" xlink:href="#gradient1f"/>

        <linearGradient id="gradient2" gradientUnits="userSpaceOnUse" x1="0" y1="100" x2="100" y2="100">
           <stop offset="0" stop-color="red"/>
           <stop offset="1" stop-color="blue"/>
        </linearGradient>
    </defs>

    <rect transform="translate(50,10)" fill="url(#gradient1)" width="100px" height="100px"/>
    <rect transform="translate(200,10)" fill="url(#gradient2)" width="100px" height="100px"/>
    <text x="10" y="150">The above two squares should be blue-red gradients and look identical</text>
</svg>