documentationfor yFiles for HTML 2.6

Best Practices for Customizing Serialization

There are some things that are not necessary to implement, however, might be beneficial when you design your own types or customize the serialization process. Especially when you want to reduce the complexity of the resulting output file and the necessary customizations to serialize your own types.

Provide Default Values for Your Properties

A default value may be provided with GraphMLAttribute's defaultValue property to expose their default value to reflection. The XML serializer evaluates this property and prevents writing properties which have their default value. This significantly reduces the size of the output file and also slightly improves the (de)serialization performance. The following examples show how to annotate different types of properties:

Providing GraphMLAttributes for the XML serializer
class MyClassExtension extends MarkupExtension {
  $intValue = 0
  $color

  constructor() {
    super()
    this.$color = Color.BLACK
  }

  /**
   * @type {number}
   */
  get intValue() {
    return this.$intValue
  }

  /**
   * @type {number}
   */
  set intValue(value) {
    this.$intValue = value
  }

  /**
   * @type {!Color}
   */
  get color() {
    return this.$color
  }

  /**
   * @type {!Color}
   */
  set color(value) {
    this.$color = value
  }

  // provide GraphMLAttributes with the static $meta object
  static get $meta() {
    return {
      intValue: GraphMLAttribute().init({ defaultValue: 0 }),
      color: [GraphMLAttribute().init({ defaultValue: Color.BLACK }), TypeAttribute(Color.$class)]
    }
  }

  /**
   * @param {?ILookup} lookup
   * @returns {!MyClass}
   */
  provideValue(lookup) {
    return new MyClass(this.intValue, this.color)
  }
}
class MyClassExtension extends MarkupExtension {
  private $intValue = 0
  private $color: Color

  constructor() {
    super()
    this.$color = Color.BLACK
  }

  get intValue(): number {
    return this.$intValue
  }

  set intValue(value: number) {
    this.$intValue = value
  }

  get color(): Color {
    return this.$color
  }

  set color(value: Color) {
    this.$color = value
  }

  // provide GraphMLAttributes with the static $meta object
  static get $meta() {
    return {
      intValue: GraphMLAttribute().init({ defaultValue: 0 }),
      color: [GraphMLAttribute().init({ defaultValue: Color.BLACK }), TypeAttribute(Color.$class)]
    }
  }

  provideValue(lookup: ILookup | null): MyClass {
    return new MyClass(this.intValue, this.color)
  }
}

Annotating ECMAScript Level 5 classes

When your classes are defined with the older yFiles class syntax, you can provide GraphMLAttributes as in the following snippet.

This should only be necessary with in older code bases. Newly created classes should always be annotated with as in Providing GraphMLAttributes for the XML serializer.

// The default value for this int property is 0
$intValue: 0,
intValue: {
  $meta: [GraphMLAttribute().init({ defaultValue: 0 })],
  get: function () {
    return this.$intValue
  },
  set: function (value) {
    this.$intValue = value
  }
},

// The default value for this property is of type Color and can be converted to the string "Black"
$color: Color.BLACK,
color: {
  $meta: [GraphMLAttribute().init({ defaultValue: Color.BLACK })],
  get: function () {
    return this.$color
  },
  set: function (color) {
    this.$color = color
  }
}
// The default value for this int property is 0
$intValue: 0,
intValue: {
  $meta: [GraphMLAttribute().init({ defaultValue: 0 })],
  get: function (): number {
    // @ts-ignore
    return this.$intValue
  },
  set: function (value: number): void {
    // @ts-ignore
    this.$intValue = value
  }
},

// The default value for this property is of type Color and can be converted to the string "Black"
$color: Color.BLACK,
color: {
  $meta: [GraphMLAttribute().init({ defaultValue: Color.BLACK })],
  get: function (): Color {
    // @ts-ignore
    return this.$color
  },
  set: function (color: Color): void {
    // @ts-ignore
    this.$color = color
  }
}