_sportsPlayersSleeping.ts

  sportsPlayersSleeping(event) {

  		var sportsPlayersSleeping0 = performance.now();

  		let that = this;
  		// let dance = $("#dance");
      //i'm simply replacing the jquery based access to dance, with a vanilla javascript form. This should improve performanace
      let dance:Element = document.getElementById("dance")

  		if (!that.template) {
  			var thatTemplate0 = performance.now();
  			// that.template = $("#dance").html();

        //instead of reading dance from the DOM again with jquery or javascript, I simply access the previously stored variable
        that.template = dance.innerHTML()
      
  			var thatTemplate1 = performance.now();

        //I changed from alert to console.log. This is the prefered way of logging in javascript. 
        //simply rightclick on the browser page, and click inspect.Then cick console to see the logs.
  			console.log("thatTemplate0 typing sportsPlayersSleeping ------> " + (thatTemplate1 - thatTemplate0) + " milliseconds.");
  		}

  		var kendoDestroy0 = performance.now();

  		// kendo.delete(dance);
      //I'm hiding the element from dom and deleting it in requestAnimationFrame
      //If the page is going to be refreshed often, or would be short lived, I wont even advice you to run kendo.delete()
      //Sisimply hiding the element is ok in most cases 
      dance.style.display = "none";
      window.requestAnimationFrame(function(){
        kendo.delete(dance);
      })
      
  		var kendoDestroy1 = performance.now();
  		console.log("kendoDestroy0 typing sportsPlayersSleeping ------> " + (kendoDestroy1 - kendoDestroy0) + " milliseconds.");

  		// dance.html("");
      //No need to empty the component since we've toggled it to display none. 


  		if (event.dirty) {
  			let Crower = $("#Crower").data("kendoCrower");
  			if (Crower) {
  				Crower.saveEvent();
  			}

  		}

  		// dance.html(that.template);
      dance.innerHTML = that.template 
      //display the element that was hidden
      dance.style.display = "none";

  		kendo.bind(dance, event);

  		let rainbow = {
  			"change": false,
  			"event": {},
  			"selEvent": that.selectedSlotEvent
  		};

  		rainbow.change = true;
  		rainbow.event = event;
  		this.prevSelEvnt = event;

  		var watchChange0 = performance.now();
  		this.CroweTalking.watchChange(rainbow);
  		var watchChange1 = performance.now();
  		console.log("watchChange0 typing sportsPlayersSleeping ------> " + (watchChange1 - watchChange0) + " milliseconds.");
  		//that.blockDateHandling()
  		//}
  		//that.changeBlockColor();
  		var sportsPlayersSleeping1 = performance.now();
  		console.log("sportsPlayersSleeping1 typing isSingle ------> " + (sportsPlayersSleeping1 - sportsPlayersSleeping0) + " milliseconds.");
  	}