We am using ionic 3 with d3js. We have lot of d3.js transitions in each component (which we believe takes lot of memory).
App responds quickly(fast) to navigation and content rendering initially however after navigating 5-10 pages, app gets slower. We see lag in page navigations and content rendering.
We believe this is because of view caching in iconic 3 (not sure if view caching is enabled in iconic 3).
When user clicks on navigation buttons, we push or pop from NavController.
Is there way to disable view caching so that app performance is same irrespective of how many times user navigates between views?
“@ionic/app-scripts”: “3.1.9”,
“@ionic-native/core”: “4.7.0”,
import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { ColumnChart } from ‘…/charts/v1/column-chart/column-chart’;
import { MigrationChart } from ‘…/charts/v1/migration-chart/migration-chart’;
@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {
constructor(public navCtrl: NavController) {
console.log(‘construct again’);
}
showMigrationChart() {
this.navCtrl.push(MigrationChart);
}
showColumnChart() {
this.navCtrl.push(ColumnChart);
}
}
import { Component, OnInit, ViewChild, ElementRef } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { migrationEngine } from ‘./migration.engine’;
@Component({
selector: ‘migration-chart’,
templateUrl: ‘…/…/common/chart.html’
})
export class MigrationChart implements OnInit {
@ViewChild(‘appChart’) private chartContainer: ElementRef;
public chartName = ‘Column Chart’;
constructor(public navCtrl: NavController) {
console.log(‘MigrationChart construct again’);
}
ngOnInit() {
this.chartName = migrationEngine(this.chartContainer.nativeElement);
}
public onBackClick() {
console.log('getViews length= '+ this.navCtrl.length());
this.navCtrl.pop();
}
}