search

TheOpenCloudEngine / uEngine5-base

uEngine5 BPMS that totally re-written in Microservices architecture. uEngine5 can act as not only a conventional Workflow or BPMS but also as a REST api orchestrator or a BPaaS (Business process as a service) of members of OCE's MSA components.
MIT License
10 stars 13 forks source link

디자이너 프로세스 로딩 속도 개선 #73

Open pinoqio opened 6 years ago

pinoqio commented 6 years ago

프로세스 xml 파일이 클 경우 디자이너 로딩 속도가 현저하게 느림 개선 필요합니다.

pinoqio commented 6 years ago

로딩 속도 뿐만 아니라 모델링 변경 시 처리 속도가 느린 관계로 모델링 작업이 힘듭니다.

SeungpilPark commented 6 years ago

테스트 리소스

순수 렌더링 시간 측정을 위해 타이머 버스이벤트 만듬 (콘솔 출력, 초단위 출력)

    mounted: function () {
      this.render();
      this.bindEvents();

      var me = this;
      window.Vue.OGBus.$on('renderingTime', function (a, b) {
        if (!me.timerMap.renderingTime[a]) {
          me.timerMap.renderingTime[a] = 0;
        }
        me.timerMap.renderingTime[a] += b;
      });
    },

1차 시도

Total progress time 20860  => 총 로직 소요시간 21초
Opengraph.vue?8642:1149 Canvas Rendering time {
  "renderingTime": {  => 캔버스 렌더링 시간
    "ac4e0838-e436-e1cf-6331-df9757fceeb6": 2515,
    "3ac7cfd4-9e5e-e933-1ca6-85c161a16827": 248,
    "57241a9b-18f4-ded8-fab5-95b0a6cd68d3": 179,
    "4769282d-3581-d379-a405-599c52ea2741": 192,
    "2acef874-b4ab-c730-260f-1d77a8ece1b3": 179,
    "51ccde82-0c99-8f6b-3565-056b573cd838": 192,
    "04149f85-4344-f04b-c105-9587b52b9462": 179,
    "0180cfa1-34ba-75aa-f0b1-9e3a11c121d5": 183,
    "7e454909-7d13-d440-2a96-56b28c4899f1": 191,
    "30c7178a-f090-9a2e-3fa3-9541147f3143": 181,
    "cae9c268-9f92-1abb-f30f-676b650ce2ac": 193,
    "67dec118-fb91-9664-6e0b-468026fdc313": 187,
    "fb42814c-4e51-4ecc-a8e1-43c6b6b952ba": 176,
    "eb648d5b-b88e-4e97-4c26-c7c07620cc1d": 187,
    "07347721-5c97-91e7-2731-a4c734594ca9": 179,
    "71d671c9-258a-d3b1-32d2-750b95d78630": 192,
    "2a9082da-1fd3-b6d6-6d5e-9d0055c60c1e": 179,
    "26d7fb61-dca8-a6ba-33a6-b58cf52242f5": 176,
    "41d2a6fb-a2e4-ce8d-ee0e-860b674576c7": 177,
    "0b7cb3e0-fa40-f973-0383-692776e7c7e1": 193,
    "bad93f03-c9ab-6e92-0127-a89f1015c105": 184,
    "06f23e2a-1580-d37a-63ed-05b575727241": 192,
    "7c7fd038-8d92-9c9a-b630-5315f186b8cf": 180,
    "98f8d882-1bb8-318e-bfe3-dd3f6ad1e47a": 188,
    "e6585ed6-ebc0-d67d-dffb-84d8b1c24d75": 187,
    "cfeb28d2-36cc-d952-3711-4ccc6b307d1b": 203,
    "ef8c292c-8795-cbb4-0460-e7c7540e995d": 182,
    "a4db2d3e-8150-bf97-0ddb-7419e748af9e": 173,
    "6aaa702a-faba-fcd3-22be-e5da505209bc": 196,
    "c563f174-dc0e-d772-7e2c-8b13955ef745": 180,
    "9a9d9e44-babc-6c51-e46c-60ee8efd7df9": 183,
    "faae843f-ec02-c3f2-6ae7-757eb803e9fd": 185,
    "166583d8-3070-fd7e-5442-90cca6035089": 180,
    "04e94166-9424-f7cc-fe7b-e779547326b5": 199,
    "58b824d8-032b-0b10-daba-3c48384c00f4": 200,
    "8463a972-298d-ffd9-3c97-59e4fc79cfed": 181,
    "59335285-244f-0044-40e3-23b488332402": 182,
    "2977373b-954c-af08-7419-b18237bf3bc5": 195,
    "298630aa-bbf0-0a17-366a-043254af6bce": 187,
    "36f904c8-914f-5f64-af30-0be8ece45747": 183,
    "8e6eb198-b251-6a47-0c5e-6558784f9a07": 212,
    "24ebd6d7-f533-d49b-e0a2-2784db95f132": 185,
    "7a72fb0e-e683-c730-e8bf-d36087596496": 184,
    "1a642c6d-4a35-3d04-ef1c-e0bf15f7a676": 179,
    "807d9b51-e56f-4951-eabc-a51111f43129": 192,
    "626e074d-812f-e56d-3adf-ae92133ed4d2": 193,
    "e5cb7dc5-ba9c-6eba-4da8-a9147ef973f7": 191,
    "4d77a0fd-a97c-09bb-97ed-1325951e27b7": 184,
    "311a0853-8c19-e322-00ab-33cf54c63104": 204,
    "378a6c30-c2a5-f718-bcfd-daedc7ccced0": 193,
    "0d5d77a4-a72f-50d1-a14c-4445ce521fbe": 200,
    "1bffcd2b-ff1e-b899-661d-1ab7a090da54": 200,
    "c160d2e3-96b8-03c2-9f85-41442bdfce18": 189,
    "15df4627-cf1d-2a0c-3d40-8435ae05c9f6": 190,
    "36c9a6d6-82b6-ceb5-a512-0c581b2a086b": 185,
    "de734dbc-4576-a772-9904-30c95d22e5b8": 190
  }
}

2차 시도

<!--drawer : 프로퍼티 창 열림유무-->
<!--drawer 를 걸지않으면 bpmn 시작시 매퍼 캔버스 와 매퍼 도형이 액티비티 마다 만들어짐 => 퍼포먼스 저하-->
<bpmn-mapper v-if="drawer" :definition="definition"></bpmn-mapper>
Total progress time 9120  =>  9초
Opengraph.vue?8642:1149 Canvas Rendering time {
  "renderingTime": {
    "9c259fe6-a3d4-3f99-3159-e0d60bb4be10": 2380 => 렌더링 2.3초
  }
}

3차 시도

Element props 변화 감지 부분의 로직을 모두 주석처리하고 재시도함.

Total progress time 9015  =>  9초
Opengraph.vue?8642:1149 Canvas Rendering time {
  "renderingTime": {
    "9c259fe6-a3d4-3f99-3159-e0d60bb4be10": 2427 => 렌더링 2.3초
  }
}

4차 시도

라이프싸이클 추적을 위해 걸어놨던 콘솔 메세지 모두 주석 처리

Total progress time 7432  =>  7.5 초
Opengraph.vue?8642:1149 Canvas Rendering time {
  "renderingTime": {
    "2d653ac8-8de3-bda7-fb9a-02f326e46885": 2410
  }
}

5차 시도

개발자 창을 닫고, 렌더링 후 결과확인을 위해 다시 켜봄.

Total progress time 4270  => 4초
Canvas Rendering time {
  "renderingTime": {
    "b6c060a4-29d5-7dbe-2165-9bf5aac33f48": 1938
  }
}

Summary

가장 큰 퍼포먼스 저하 요소인 bpmn-mapper 컴포넌트의 커밋 시점이, 이 이슈를 달기 전인 것으로 나오고 있기에, 일단 의심은 가지만 이슈등록하신 분 저에게 연락을 좀 주시겠어요?

커밋을 받으시고, 콘솔에 찍히는 total 과 rendering 수치를 알려주시고, 아울러 모델링 할 때 체감속도 확인을 위해 원격 또는 동영상을 첨부부탁드려요.

pinoqio commented 6 years ago

본 프로젝트에서는 ConditionEditorRelation.vue 개발이 본사에서 진행중인 관계로 ConditionEditorRelation.vue 대신에 Relation.vue를 사용하고 있습니다. 따라서 위에서 확인된 사항은 본 프로젝트에서 적용되지 않습니다. 원격 또는 동영상 전달이 안되는 관계로 본 환경에서 테스트 한 결과 드립니다.

개발환경 (가상화) Intel Xeon E5-2680 v3 2.5GHz * 2 6GB Windows7 64bit

UserTask, Relation, Gateway 모두 합쳐 50개 정도 되는 프로세스

1) Relation.vue 적용시 Total progress time : 17초 (크롬 메모리 400MB) 2) v-if 적용된 ConditionEditorRelation.vue 적용시 Total progress time : 40초 (크롬 메모리 700MB) 3) v-if 미 적용된 ConditionEditorRelation.vue 적용시 Total progress time : 866초 (크롬 메모리 2GB)

최종적으로 2)번 case로 진행이 되어야 하는데, 현재 40초 정도가 걸리는 관계로 사용이 불가능한 상황입니다. 2)번 사항의 상세 리포트는 아래와 같습니다.

Total progress time 39585 Canvas Rendering time { "rendering time" : { "0ed7b21b-5468-f5e2-7827-c800a0ad5ca4": 19343 } }

SeungpilPark commented 6 years ago

통화 후, 추가 문제점 보완하여 커밋하고, 모델링 가능하다는 수준까지 답변받았습니다.

통화 후 원인분석으로 추후 우려되는 부분을 캐치.