Как повысить производительность JointJS с большим количеством ссылок?

После профилирования кода похоже, что функция bbox вызывается повторно. Я не могу удалить marker-source, marker-target и connection-wrap, потому что мне нужны эти функции. Есть ли способ улучшить производительность?


jointjs
person juria_roberts    schedule 01.09.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Попробуйте заменить marker-source и marker-target на маркеры SVG. Это относительно легко реализовать, если ваше приложение не требует разных размеров и цветов маркеров. Например:

  1. Определите свою собственную маркерную стрелку.
var arrowMarker = V('marker', {
   viewBox: "0 0 10 10",
   refX: 9,
   refY: 5,
   markerWidth: 6,
   markerHeight: 6,
   orient: "auto"
}, [
   V('path', {
       'd': "M 0 0 L 10 5 L 0 10 z",
       'fill': 'green'
   })
]);
  1. Добавьте маркер в SVG Defs документа, чтобы его можно было повторно использовать позже несколько раз.
V(paper.defs).append(arrowMarker);
  1. Наконец, поместите маркер на ссылку. Используйте marker-end или marker-start для определения target соотв. source маркер.
var link = new joint.dia.Link({
    markup: '<path class="connection"/><path class="connection-wrap"/>',
    attrs: {
        '.connection': {
            'stroke': 'green',
            'stroke-width': 2,
            'marker-end': 'url(#' + arrowMarker.attr('id') + ')'
        }
    }
});

Существует JSFiddle с примером и другими полезными советами по повышению производительности.

person Roman    schedule 02.09.2016