который, если самый быстрый? xhr с XML или динамически добавить файл сценария? - PullRequest
0 голосов
/ 12 декабря 2011

У меня есть файл «script.php», который печатает данные из базы данных, но я хочу динамически загружать и обрабатывать данные из файла в javascript.Быстрее ли создать новый тег сценария («script.php» имеет тип содержимого: text / javascript), например

var script = document.createElement('script');
script.src = "script.php";
appendTheScriptToTheHead(blablabla);

, с данными в массиве javascript или получить данные вФормат XML через XHR, например («script.php» имеет тип содержимого: text / xml)

var xhr = new XMLHttpRequest();
xhr.open("POST","script.php",true);
xhr.onload = function(){
    xhr.responseXML;
}
xhr.send(null);

?

Спасибо

Ответы [ 3 ]

2 голосов
/ 12 декабря 2011

- ОБНОВЛЕНО --- ОПТИМИЗИРОВАННЫЙ КОД ---

Я сделал небольшой тест и вот результаты

для 1000 итераций,

XML-объект занял 4270 мс

Простое добавление тега скрипта заняло 4169 мс;

Мощный XHR с использованием функции Eval дал 3206 мс;// Самый быстрый

Для справки здесь приведены сценарии на стороне клиента и на сервере.

Script 2.php

<?php

echo trim('
 var dunce = {
    menu : {
        id:1,
        gohan:"goku blah blah blah"
    }

 };

console.log(dunce.menu.id);  // yeah its still faster

iteration++;
if(iteration<1000){
ScriptTAG();
}else{
            console.log("Total time taken for "+iteration+"iterations is "+ (new 
                                Date().getTime()-start) );
}');


?>

Script.php [вывод xml]

 <?php
   header ("Content-Type:text/xml");  
   echo"<menu><id>1</id><gohan>Goku blah blah blah</gohan></menu>";
 ?>

Клиентский файл

var iteration = 0;
        // Use XHR
        var start ;
        // Use console for firing these
        function XHR() {
            if(iteration == 0) {
                start = new Date().getTime();
            }
            var io = new XMLHttpRequest();
            io.open("POST",'script.php',true);
            io.onload = function() {
                iteration++;
                if(iteration<1000) {
                    XHR();
                } else {
                    alert("Total time taken for "+iteration+"iterations is "+ (new Date().getTime()-start) );
                }
            }
            io.send();
        }
            function AlterXHR(){
            // EVAL IDEA

             if(iteration == 0){
                start = new Date().getTime();
            }
            var io = new XMLHttpRequest();
            io.open("POST",'script2.php',true);
            io.onload = function(){
                eval(io.responseText);
            }
            io.send();
            }
        function ScriptTAG() {
            if(iteration == 0 ) {
                start = new Date().getTime();
            }
            var script = document.createElement('script');
            script.src = "script2.php";
            document.head.appendChild(script);
        }

        ScriptTAG(); // Replace this with whatever u want to test! and run!!

Я думаю, что здесь разница была исключительно из-за более быстрой компиляции нативного объекта javascript по сравнению с XML Parser.

Как вы можете увидеть тот же сценарий сФункциональность NATIVE EVAL работала намного быстрее!

0 голосов
/ 12 декабря 2011

XML всегда медленно потребляется в JavaScript, так как вам нужно использовать DOM-парсер для его чтения, поэтому JSON всегда предпочтительнее при использовании JavaScript.

Не по теме: вы должны учитывать угрозу безопасности при размещении ваших данных в динамическом теге сценария, так как ваш сайт может подвергаться некоторым XSRF-атакам из-за пропуска той же политики происхождения, которую вы получаете при использовании XHR.

Избегайте этого, добавив время (1);в верхней части вашего ответа, сделав невозможным использование ваших данных с помощью тега script с какого-то злого сайта.Это, конечно, должно быть удалено перед использованием данных.

Удачи:)

0 голосов
/ 12 декабря 2011

Вы, вероятно, хотите отправить результаты своей базы данных через Ajax и лучше в формате JSON, чтобы их можно было легко обработать с помощью некоторой функции JavaScript на стороне сервера.

Эта опция позволяет иметь запасную часть в вашемкод, на случай, если что-то не так.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...