JavaScript - тормозят счётчики

o_nix

o_nix

Хранитель порядка
Регистрация
7 Ноя 2007
Сообщения
1.070
Реакции
1.063
В общем вопрос простой
Возможно ли асинхронное исполнение js на странице ??


тоесть мне нужно расставить приоритеты js скриптам
чтобы одни исполнялись прежде других не дожидаясь исполнения других скриптов

js счётчики при проблемах на серверах статистики очень сильно тормозят загрузку страницы до 100% а нужный мне js исполняется по событию страница загружена.

Можноли как то полностью подгрузить страницу чтобы исполнялся этот код а только потом грузить счётчики ??

Есть очучение что нельзя, пока все скрипты не подгрузятся и не исполнятся страница будет считаться не загруженой.
 
Да можно динамически управлять когда загружать, когда исполнять. Когда нужно загрузить, то нужный файл цепляется в head, а когда файл загрузится запускается нужная функция. Пример загрузки jQuery
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>dynamic js loading</title>

<script type="text/javascript">
//динамическая загрузка js
function include_js(path_js, callback){
    var script = document.createElement("script");
    script.src = path_js;
    script.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(script);
    
    if(callback){
        // Firefox
        script.onload = function() {
            eval(callback + "();");
        }
        
        // IE
        script.onreadystatechange = function() {
            if (/loaded|complete/.test(this.readyState)) {
              eval(callback + "();");
            }
        }
    }
}



//первая функция
function main(){
    alert("страница загружена");
    //подключаем дополнительный файл и после его загрузки запускаем функцию jquery() если надо
    include_js("https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js", "jquery");
}

//запускается после загрузки файла
function jquery() {
    $(document).ready(function(){
        $("body").text("jQuery библиотека загружена");
    });
}

main();

</script>


</head>

<body>
</body>
</html>
для теста можно загружать php файл
PHP: 
sleep(5);
 
Не так работает

вот код с текстом в body
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=win-1251" />
<title>dynamic js loading</title>
<script type="text/javascript">
//динамическая загрузка js
function include_js(path_js, callback){
    var script = document.createElement("script");
    script.src = path_js;
    script.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(script);
    if(callback){
        // Firefox
        script.onload = function() {
            eval(callback + "();");
        }
        // IE
        script.onreadystatechange = function() {
            if (/loaded|complete/.test(this.readyState)) {
              eval(callback + "();");
            }
        }
    }
}
//первая функция
function main(){
    alert("страница загружена");
    //подключаем дополнительный файл и после его загрузки запускаем функцию stat() если надо
    include_js("https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js", "jquery");
}
//запускается после загрузки файла
function jquery() {
    $("body").text("jQuery библиотека загружена");
}
main();
</script>
</head>
<body>
тут простио текст <br>с которым работает js<br> который должен быть запущен исполнен до подгрузки кода счётчиков, тизеров и прочего хлама. 
</body>
</html>

Запускаю страницу - вижу alert страница загружена НО текста body не видно
тоесть еслти я на этом этапе запущу свой скрипт он мне скажет что искомое отсутствует.

Мне необходимо отобразить весь body, затем обработать его js и только потом запустить подгрузку всех второстепенных тяжёлых скриптов

Или как вариант если такое есть в js запускать функцию обработки данных не по событию window.onload а по некоему событию "такойто блок или класс отображён на странице"
и опятьтаки чтобы всё это исполнилось до всего остального хлама.
то есть с дополнительным условием если мой первый js выполнился тогда далее грузим всё остальное.

Добавлено через 16 минут
ой всё нормально просто переместил вызов функции в отдельный js в нужное место html :) Пока в боевых условиях не тестил но вроде должно работать
СПАСИБО :)

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=win-1251" />
<title>dynamic js loading</title>
<script type="text/javascript">
//динамическая загрузка js
function include_js(path_js, callback){
    var script = document.createElement("script");
    script.src = path_js;
    script.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(script);
    if(callback){
        // Firefox
        script.onload = function() {
            eval(callback + "();");
        }
        // IE
        script.onreadystatechange = function() {
            if (/loaded|complete/.test(this.readyState)) {
              eval(callback + "();");
            }
        }
    }
}
//первая функция
function main(){
    alert("страница загружена");
    //подключаем дополнительный файл и после его загрузки запускаем функцию stat() если надо
    include_js("https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js", "jquery");
}
//запускается после загрузки файла
function jquery() {
    $("body").text("jQuery библиотека загружена");
}

</script>
</head>
<body>
<div>тут простио текст <br>с которым работает js<br> который должен быть запущен исполнен до подгрузки кода счётчиков, тизеров и прочего хлама. <script type="text/javascript">
main();
</script></div>

<div>тут простио текст <br>с которым работает js<br> который должен быть запущен исполнен до подгрузки кода счётчиков, тизеров и прочего хлама. </div>
</body>
</html>
 
наверное не работал потому что jquery не успел инизиализироваться, забыл добавить $(document).ready(function(){ });
исправил.
 
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху