Я читав найкращий спосіб обробки зображень для веб-сайту (який циклічно відображається за допомогою зображень, коли користувач натискає елемент), і видається, що перевага є попередньою завантаженням.
Враховуючи, ви можете витягти попередню завантажувач іпоточна установка просто вставить image1 в div в будь-якому випадку з масиву, чи попередня завантажувач працює, включивши всі можливі HTML-запити на початок, тим самим зменшуючи час потенційного завантаження пізніше, чи це марне виконання, як це було написано?
Чи повинен я дійсно брати зображення з imageObj в .append(...) ?
-ПРАВИЛЬНИК. - Я розумію, що я дійсно дозволяю викликати зображення 1, як це є, але це просто практика.
<body>
<a href="#" id="image1">
Click for image 1
</a>
<hr/>
<a href="#" id="image2">
Click for image 2
</a>
<hr/>
<a href="#" id="image3">
Click for image 3
</a>
<hr/>
<a href="#" id="image4">
Click for image 4
</a>
<div id="image">
</div>
</body>
JavaScript / jQuery
// JavaScript Document
function preloader()
{
var i = 0;
imageObj = new Image();
images = new Array();
images[0]="images/image1.jpg"
images[1]="images/image2.jpg"
images[2]="images/image3.jpg"
images[3]="images/image4.jpg"
for(i=0; i<=3; i++)
{
imageObj.src=images[i];
}
}
$(document).ready(function(){
preloader();
$("#image1").click(function(){
alert("Handler for #image1 .click() called.");
$("#image").append("<img id="theImg" src="/images/ + images[0] + " />");
});
});
Відповіді:
0 для відповіді № 1Ефект цього коду полягає в тому, щоб просто "торкнутися" кожен можливий образ, щоб він завантажувався в кеш, але не ваш DOM, якщо це має сенс.
Чи повинен я дійсно брати зображення з imageObj в .append (...)?
Ні, ця частина полягає лише в тому, щоб змусити попередньо завантажувати зображення в кеш-пам'ять вашого браузера. Зверніть увагу, як це перезаписано майже відразу в циклі.
Якщо ви хочете спалахувати швидкості завантаження, також подумайте про те, щоб ваші зображення надходили з декількох піддоменів або CDN.