Property compute is expensive

controllers.application.js

import Ember from 'ember';

var fib = function(n){
  switch(n){
    case 0: return 0;
    case 1: return 1;
    default: return fib(n-1) + fib(n-2);
  }
};

var ItemModel = Ember.Object.extend({
  someProperty: Ember.computed('index', 'root.clock', 'root.computationCost', function(){
    return fib(Math.floor(this.get('root.computationCost'))) + this.get('root.clock') + this.get('index');
  }),
});

export default Ember.Controller.extend({
   appname: 'Ember Twiddle', 
   requestedItemCount: 1,
   refreshRate: 10,
   enableIncreasingItems: false,
   computationCost: 0,

   refreshDelay: Ember.computed('refreshRate', function(){
     if (this.clockTimeout){
       Ember.run.cancel(this.clockTimeout);
       this.clockTimeout = null;
     }
     var refreshRate = this.get('refreshRate');
     var refreshDelay = 1000 / refreshRate;
     if (refreshRate != 0){
       this.updateClock(refreshDelay);
     }
     return refreshDelay;  
   }),
   initClock: Ember.on('init', function(){
      this.set('startTime', (new Date).getTime());
      this.updateClock();
   }), 
   clockMs: Ember.computed('startTime', function(){
      var startTime = this.get('startTime');
      var currentTime = (new Date).getTime();
      return currentTime - startTime;
   }), 
   clock: Ember.computed('clockMs', function(){
      return Math.floor(this.get('clockMs') / 1000);
   }), 
   updateClock: function(refreshDelay){
      this.notifyPropertyChange('clockMs');
      this.clockTimeout = Ember.run.later(this, function(){
        this.updateClock();
      }, refreshDelay);
   },
   itemCount: Ember.computed('clock', 'requestedItemCount', 'enableIncreasingItems', function(){
      if (this.get('enableIncreasingItems')){
        return Math.floor(this.get('clock') / 20) * 1;
      }
      return this.get('requestedItemCount'); 
   }), 
   items: Ember.computed('itemCount', function(){
      var result = Ember.A([]);
      for (var i = 0; i < this.get('itemCount'); i++){
        result.push(ItemModel.create({root: this, index: i}));
      } 
      return result;
   }),
});

templates.application.hbs

<h1>Welcome to {{appName}}</h1>
<br>
<br>
Clock: {{clock}}
<br>
RefreshRate: {{refreshRate}} times / sec <br />
RefreshDelay: {{input type='range' min=0 max=100 step=1 value=refreshRate}} {{refreshDelay}} ms <br />
requestedItemCount: {{input type='range' min=0 max=100 step=1 value=requestedItemCount}} {{requestedItemCount}} <br />
computationCost: {{input type='range' min=0 max=100 step=1 value=computationCost}} {{computationCost}} <br />
Enable Increasing Items: {{input type='checkbox' checked=enableIncreasingItems}}<br />
<br>
{{#each items as |item|}}
	<span>{{item.index}} - {{item.someProperty}}</span>
{{/each}}
<br>

twiddle.json

{
  "version": "0.10.6",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.9.0",
    "ember-data": "2.9.0",
    "ember-template-compiler": "2.9.0",
    "ember-testing": "2.9.0"
  },
  "addons": {}
}