kolkov / angular-editor

A simple native WYSIWYG editor component for Angular 6 -14+
https://angular-editor.kolkov.ru
MIT License
674 stars 361 forks source link

Application performance issue with Angular 12 #376

Open ghost opened 3 years ago

ghost commented 3 years ago

Using the library causing the performance issue on the application, quite not sure what is the reason for this

<div fxLayout="row" fxLayoutAlign="space-around center">
        <angular-editor [config]="editorConfig"></angular-editor>
      </div>

Configuration

this.editorConfig = {
      editable: true,
      spellcheck: true,
      height: '15rem',
      minHeight: '5rem',
      placeholder: 'Enter text here...',
      translate: 'no',
      defaultParagraphSeparator: 'p',
      defaultFontName: 'Arial',
      toolbarHiddenButtons: [
        ['bold']
      ],
      customClasses: [
        {
          name: "quote",
          class: "quote",
        },
        {
          name: 'redText',
          class: 'redText'
        },
        {
          name: "titleText",
          class: "titleText",
          tag: "h1",
        },
      ]
    };

Lots of violation error on the console window as shown below and the application is quite slow

image

Not sure what is the real cause of performance issue. I am using Angular 12

kolkov commented 3 years ago

Hi! Thanks for your issue. I will try to reproduce this.

GeorgeTheEnthusiast commented 3 years ago

I have similar problem with angular 12.2.5 + ts 4.3.5 + package 1.2.0 - when adding to the simple html - the app is freezing without possibility to find out why this is happening. @kolkov could you help me somehow?

GeorgeTheEnthusiast commented 3 years ago

I've manage to find out the real cause of this - the ChangeDetection.Default strategy is causing to infinite refreshView loop. Changed to changeDetection: ChangeDetectionStrategy.OnPush solved the problem.

BaptisteKELAGOPIAN commented 1 year ago

I've manage to find out the real cause of this - the ChangeDetection.Default strategy is causing to infinite refreshView loop. Changed to changeDetection: ChangeDetectionStrategy.OnPush solved the problem.

Work for me, thanks

vc-pratik-padia commented 11 months ago

Use ChangeDetectionStrategy.OnPush strategy without knowing the side effects would invite more issues, better try this https://github.com/kolkov/angular-editor/issues/434#issuecomment-1712168290