change method

[johnedvard]

I had some performance issues because of ngAfterViewChecked(). the Method was called on every scroll-event, making the page a little bit laggy. Do you think it is possible to use ngAfterViewInit() instead?

[JayChase]

ngAfterViewInit() will be called before the DOM is updated when binding to dynamic content like innerHTML in the demo so it will not get highlighted. I've had a try adding a load of code snippets and trying to get ngAfterViewChecked() to fire when scrolling but I've not had any luck. Could you let me know the Angular 2 version you are using?

[johnedvard]

I am using angular 2.1.0. I will try to reproduce the problem, just making sure that I did not mistook anything.

[Lestoroer]

I had this issue too and I changed to ngAfterViewInit(). This better by one reason. If you have much code on your page, ngAfterViewChecked() just kills it. So If DOM was changed I called method on this event. And I use next code for example:

HTML your component

<textarea [(ngModel)]="comment" (input)="inputTextarea(codeComment)"></textarea>
<div [innerHTML]="comment" highlight-js-content=".highlight" #codeComment></div>

TS your component

import { ChangeDetectorRef } from '@angular/core';
import { HighlightJsService } from 'node_modules/angular2-highlight-js/lib/highlight-js.service';

constructor (private cd: ChangeDetectorRef, private service: HighlightJsService) {}

inputTextarea(codeComment) {
      this.cd.detectChanges();
      let snippets = codeComment.querySelectorAll('code');
      let snippet;
      for (let _i = 0, snippets_1 = snippets; _i < snippets_1.length; _i++) {
         snippet = snippets_1[_i];
         this.service.highlight(snippet);
      }
}

[babeal]

I am running into the same performance problems. The directive starts taking up 30% of the processor is there is any other work going on inside of an angular zone like a web socket connection.

[babeal]

I am using angular 2.4.4

[babeal]

When looking at the dom, I see all the dom nodes flashing associated with the code snippets where there is no change to the data. This only happens when i open up a web socket connection, so I think the connection is within zone and causes the func afterViewChecked to be called over and over again. What can be done to fix this?