Ignoring TypeScript generated files from Git

22. April 2019 16:41 by Cameron in Git, javascript, TypeScript  //  Tags: , , , , , , ,   //   Comments

I recently started a project with TypeScript and found that the js and js.map files were being added to my repository. These files are automatically generated with each build of your TypeScript code so they're not needed in the repository. To remove these if you've already added them, run the following:

git rm src/**/**/*.js
git rm src/**/**/*.js.map

Following that, you can add these lines to your .gitignore to ensure they're not added back:

src/**/**/*.js
src/**/**/*.js.map

Knockout Observable Array Performance Improvments

Today, I was working on a project that makes AJAX calls to an API and noticed that the application was very slow and unresponsive during the AJAX calls and ko updates. I checked that the requests weren't taking too long in Chrome's developer tools and found they were at max taking 300ms and minimum of 20ms to return. This was very odd behavior since the AJAX requests weren't blocking.

After some research, I found that when updating ko.observableArrays, you don't want to push each individual item to the array if you can help it. Each time an item is pushed to a ko.observableArray, it notifies its subscribers and depending on how many DOM elements you have on your page, that can be rather taxing. I had code like this:

$.ajax({
	url: 'api/Document/',
	method: 'GET',
	dataType: 'json',
	success: function(data) {
		Documents([])
		for(var i = 0; i < data.length; i++)
			Documents.push(data[i]);
	}
});

To fix this, you need to create temporary arrays to push your items to and then assign the ko.observableArray to the contents of the temporary array. Your code should look more like this:

$.ajax({
	url: 'api/Document/',
	method: 'GET',
	dataType: 'json',
	success: function(data) {
		var documents = [];
		for(var i = 0; i < data.length; i++)
			documents.push(data[i]);	

		Documents(documents);
	}
});

Month List

Tag cloud