javascript - changing to Web Workers from AJAX setInterval -


i have script (below) asynchronously updates markup on setinterval; markup generated jquery xml data. attempt @ creating ui in users can view see changes happen xml data in real-time. however, seeming round way of acheiving desired effect compared web workers api; finding out ajax script , setinterval function unreliable; script appears freeze or not respond @ initial loads , after running long periods of time points . how can modify code use workers instead of ajax or setinterval?

            setinterval(refreshxml, 1500);              function refreshxml() {               var req = $.get('administration/data/people.xml');                req.done(function(xml) {                     // update global xml variable used create buttons.                     window.peoplexml = xml;                      // clear existing buttons.                     $('#loadme').empty();                      // display button each xml person entity.                     $(xml).find('fullname').each(function(index) {                             var fullname = $(this).text();                              $('<button>', {                               'class': 'mybutton',                               value: $(this).siblings('id').text(),                               text: fullname                             }).appendto('#loadme');                               });                      // update person divs visible.                     $('#toadme .person').each(function() {                       // grabs id data-person-id set earlier.                       var id = $(this).data('person-id');                        show_person(id);                     });               });             }              function show_person(id) {               $('#person-detail-' + id).remove();                get_person(id).appendto('#toadme');             }              function get_person(id) {               var $person = $(window.peoplexml).find('id:contains(' + id + ')').parent();                var $div = $('<div>', {                     'class': 'person',                     'data-person-id': id,                     id: 'person-detail-' + id               });                $('<h1>', { text: $person.find('firstname').text() }).appendto($div);               $('<h1>', { text: $person.find('lastname').text() }).appendto($div);               $('<h1>', { text: $person.find('age').text() }).appendto($div);               $('<h1>', { text: $person.find('hometown').text() }).appendto($div);               $('<h1>', { text: $person.find('job').text() }).appendto($div);                return $div;               }              $(document).on('click', '.mybutton', function() {                     $('#toadme').empty();               show_person(this.value);             }); 

the name of above script home.js , here example of index page (index.html) , worker (my_task.js):

            // index.html             <script>     var myworker = new worker("my_task.js");      myworker.onmessage = function (oevent) {       console.log("worker said : " + oevent.data);     };      myworker.postmessage("ali");                 // my_task.js     postmessage("i\'m working before postmessage(\'ali\').");      onmessage = function (oevent) {       postmessage("hi " + oevent.data);     }; 

how can implement home.js in way in index.html , my_task.js implemented? ton, looking way starting using workers next level since learned ajax. also, know possibly seen broad question willing improve question upon request , suggestions.


Comments

Popular posts from this blog

html - Sizing a high-res image (~8MB) to display entirely in a small div (circular, diameter 100px) -

java - IntelliJ - No such instance method -

identifier - Is it possible for an html5 document to have two ids? -