Unresponsive Script Error in JS.erb File

Currently I have the Below code in a js.erb file in my ruby on rails project. What is happening is that the page is becoming unresponsive when this file is being used. Sometimes the @updates1 can have upwards of 100 records. is there a way to process the painting in the background and keep the UI responsive. With it the way it is the page becomes "locked up/unresponsive" for 10 sec to 1 minute. sometimes i get the warning of this page has become unresponsive.

My Code works just Takes A long time to process

Actual Code in the js.erb

var obj1 = {
    "loads": <%= raw @updates1 %>
};

var count = 0;
var tab_keys = [];

$.each(obj1["loads"], function(k, v){
    $.each(v, function(key, value) {
        count++;
        var addId = $('#' + key).dataTable().fnAddData(value);
        var theNode = $('#' + key).dataTable().fnSettings().aoData[addId[0]];
        theNode.nTr.setAttribute('id','row_' + value[0]);
        $('#' + key).dataTable().fnAdjustColumnSizing();
        tab_keys.push(key);
    });
});



if (count > 0) {
    var message = count + " More Loads!";

    $.titleAlert(message, {
        requireBlur:false,
        stopOnFocus:false,
        duration:8000,
        interval:700
    });

    tab_keys = $.unique(tab_keys);
    $.each(tab_keys, function(k, v){
        var tab_key = v.replace(new RegExp("_load_results", "gi"), "");
        var tab = 'a[href$="#tab_' + tab_key + '"]';
        if ($(tab).parent().hasClass("ui-state-active") == true)
            $(tab).css("font-weight","bold").parent().effect( 'highlight', {color: 'Blue'}, 7000);
        else
            $(tab).css("font-weight","bold").parent().css("background","#00D9D9").effect( 'highlight', {color: 'Blue'}, 7000);
    });

    if ( $('#prefs_can_be_screen_notified').val() == "1") {
        playSound('/assets/'+$('#prefs_default_sound').val());
    }
}

Results of what it is doing: BTW i cut the obj1 down in length for posting on here... It can sometimes be 100+ postings...

var obj1 = {
    "loads": [{'25455_1431099504_load_results': ['13345499','2015-05-08 15:48:37 UTC','<abbr class=\"timeago\" title=\"2015-05-08 10:48:37\">1 minute</abbr>','Albuquerque, NM','Colorado Springs, CO','05/12','05/13','Full','Flatbed','','53']}, {'25455_1431099504_load_results': ['13345497','2015-05-08 15:48:37 UTC','<abbr class=\"timeago\" title=\"2015-05-08 10:48:37\">1 minute</abbr>','Gypsum, CO','Lincoln, NE','05/08','05/11','Full','Flatbed','','53']}]
};

var count = 0;
var tab_keys = [];

$.each(obj1["loads"], function(k, v){
    $.each(v, function(key, value) {
        count++;
        var addId = $('#' + key).dataTable().fnAddData(value);
        var theNode = $('#' + key).dataTable().fnSettings().aoData[addId[0]];
        theNode.nTr.setAttribute('id','row_' + value[0]);
        $('#' + key).dataTable().fnAdjustColumnSizing();
        tab_keys.push(key);
    });
});



if (count > 0) {
    var message = count + " More Loads!";

    $.titleAlert(message, {
        requireBlur:false,
        stopOnFocus:false,
        duration:8000,
        interval:700
    });

    tab_keys = $.unique(tab_keys);
    $.each(tab_keys, function(k, v){
        var tab_key = v.replace(new RegExp("_load_results", "gi"), "");
        var tab = 'a[href$="#tab_' + tab_key + '"]';
        if ($(tab).parent().hasClass("ui-state-active") == true)
            $(tab).css("font-weight","bold").parent().effect( 'highlight', {color: 'Blue'}, 7000);
        else
            $(tab).css("font-weight","bold").parent().css("background","#00D9D9").effect( 'highlight', {color: 'Blue'}, 7000);
    });

    if ( $('#prefs_can_be_screen_notified').val() == "1") {
        playSound('/assets/'+$('#prefs_default_sound').val());
    }
}