Skip to content

Fields sort option #3

@YuriGor

Description

@YuriGor

Hi there! I was redirected here from the original lydell/json-stringify-pretty-compact repo.

I suggest a new option to make JSON files even more readable:

sort fields of each object by value max depth + value number of lines + by field name alphabetically,
so first will go primitive values, next will be flat objects/arrays, and more complex values will go later.
example source JSON prettified by a current version

{
  "data": {
    "items": {
      "properties": {
        "icon": {
          "properties": {
            "width": {"type": ["string"], "default": "16px"},
            "height": {"type": ["string"], "default": "16px"},
            "url": {
              "type": ["string"],
              "required": true,
              "description": "Icon url. data urls are supported.",
              "default": "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23FFFFFF' d='M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z' /%3E%3C/svg%3E"
            }
          },
          "description": "The name from collection or an object",
          "type": ["string", "object"],
          "default":"" // is it 'default' for 'icon' or 'properties' or 'items'?
        }
      }
    }
  },
  "style":{"CSS": ""},
  "id": null
}

after sorting:

{
  "id": null, // depth 0 (<1)
  "style":{ "CSS": "" }, // depth 1 (<7)
  "data": { // depth 7
    "items": {
      "properties": {
        "icon": {
          "default":"", // depth 0 ('def'<'des')
          "description": "The icon name from icons collection or an icon object", // depth (0<1)
          "type": ["string", "object"], // depth 1 (<3)
          "properties": { // depth 3
            "height": { "default": "16px", "type": ["string"] }, // depth 2, 1 line, ('h'<w)
            "width": { "default": "16px", "type": ["string"] }, // depth 2, 1 line, (< 6 lines)
            "url": { // depth 2, 6 lines
              "default": "data:image/svg+xml, ....", // depth 0 ('def'<'des')
              "description": "Icon url. data urls are supported.", // depth 0 ('d'<'r')
              "required": true, // depth 0 (<1)
              "type": ["string"] // depth 1
            }
          }
        }
      }
    }
  }
}

Main idea to see the simplest values first,
because it's difficult to find simple value at specific nesting level, if it goes after complex object
and from the other side - it's difficult to say who is a owner of such field.

Yes I know someone will not be happy with changing the order of the fields, that's why it's optional.
But technically object's fields order is not guaranteed in the javascript, and developers should not rely on the fields order, so no real rule will be broken.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions