Sort Attributes Default
Sorts attributes in all elements in the document. This does not reduce the size of the SVG, but improves readability and may improve how compression algorithms perform on it.
Here is a demonstration of SVGs that have been gzipped by NGINX using the default compression level of 1.
| SVG | Unsorted ¹ | Sorted ² | Reduced (%) |
|---|---|---|---|
| Arch Linux Logo | 2.61 kB | 2.61 kB | 0 kB (0%) |
| Blobs | 13.89 kB | 13.88 kB | 0.01 kB (0.1%) |
| Isometric Madness | 123.87 kB | 120.09 kB | 3.78 kB (3.1%) |
| tldr-pages Banner | 791 B | 786 B | 5 B (0.6%) |
| Wikipedia Logo | 53.96 kB | 53.87 kB | 0.09 kB (0.2%) |
¹ Uses the default plugins preset excluding sortAttr and sortDefsChildren.
² Uses the default plugins preset as-is.
Usage
js
module.exports = {
plugins: ["sortAttrs"],
};module.exports = {
plugins: ["sortAttrs"],
};Parameters
orderAn array of attribute keys to order by. Attributes not found in the array are sorted alphabetically.xmlnsOrderSet to 'front' if XML namespaces should be placed infront of all other attributes.Usage example
js
module.exports = {
plugins: [
{
name: "sortAttrs",
params: {
order: ["id","width","height","x","x1","x2","y","y1","y2","cx","cy","r","fill","stroke","marker","d","points"],
xmlnsOrder: "front"
}
}
]
}module.exports = {
plugins: [
{
name: "sortAttrs",
params: {
order: ["id","width","height","x","x1","x2","y","y1","y2","cx","cy","r","fill","stroke","marker","d","points"],
xmlnsOrder: "front"
}
}
]
}