webForumDet fria alternativet

Preloada bilder (två frågor)

17 svar · 955 visningar · startad av Calevan

CalevanMedlem sedan maj 20031 133 inlägg
#1

Hej!

har två frågor, börjar med nummer ett:

Använder nu jojoxx preload skript för att ladda alla bilder i en mapp (http://www.jojoxx.net/faq/faqview.asp?q=128):

dim fso, folder, path, file, js
path="bilder/_orginal/" & rsKatalog & "/"

js=""
set fso = Server.CreateObject("Scripting.FileSystemObject")
set folder = fso.GetFolder(Server.MapPath(path))
for each file in folder.Files
   file=replace(file,"\","/")
   file=mid(file,instrrev(file,"/")+1)
   if lcase(right(file,3))="jpg" or lcase(right(file,3))="gif" or lcase(right(file,3))="png" or lcase(right(file,4))="jpeg" then
      if len(js&"")>0 then js=js&","
      js=js&""""&file&""""
   end if
next
%>

<script type="text/javascript">
 var a=new Array(<%=js%> ); var imgs=new Array();
 for(var i=0;i<a.length;i++){
   imgs[i]=new Image; imgs[i].src="<%="bilder/_orginal/" & rsKatalog & "/"%>"+a[i];
 }
</script>

Så, hittade jag en annan version med progres-bar:
http://www.jojoxx.net/jscript/archive/show.asp?id=116

och tänkte klistra ihop dessa till en, men det verkar inte gå bra. Och jag lyckades destuom inte felsöka något alls, hur borde det se ut egentligen?

och fråga två:

om jag lyckats med det ovan, så ska bilderna nu ligga i cashminnet (för de ligger väl inte i internminnet?). Måste jag nu använda samma arrays på samma sida för att webläsaren ska fatta att bilden redan är inladdad, eller är den så smart så den gör det automagiskt?

tack!

Jesper TMedlem sedan nov. 20017 058 inlägg
#2

Så här gör jag:

<div style="height:10px;width:380px;border:1px solid #999999;padding:0;margin:0;"><div style="background:#FFCC0C;width:2px;height:5px;" id="progressbar"></div></div>
<div id="status1"></div>

<script type="text/javascript">
<!--
<%
Dim FSO,imagefolder,myImages,Folder,Files,Item
imagefolder ="/my_images/"

Set FSO = Server.CreateObject("Scripting.FileSystemObject")
Set Folder = FSO.GetFolder(Server.Mappath(imagefolder))
set Files = Folder.Files

	For each Item In Files
		Select Case LCase(Right(Item1.Name, 3))
		case "jpg","gif","png"
			myImages = myimages & """"& imagefolder & Item.Name &""","
		end select
	Next

Set Folder = nothing : Set FSO = nothing 

myImages  = left(myImages , len(myImages) - 1) 

Response.Write "var imagesSrc=["& myImages &"];"& vbcr 
%>	
var imagesOnLoad="document.getElementById('status1').innerHTML='Laddar sida '+parseInt(images.loaded/images.toload*100)+'% klart.'";

var images=new Object();
images.loaded = 0;

window.onload=function(){
images.starttime=new Date();
images.toload=imagesSrc.length;
for(i in imagesSrc){
	images[i]=new Image();
	images[i].onload=function(){
		images.loaded++;
		document.getElementById("progressbar").style.width=parseInt(images.loaded) * parseInt(380/imagesSrc.length)+ 60 +"px";
		if(imagesOnLoad.length>0){ eval(imagesOnLoad); }
		if(images.loaded==images.toload){
			images.stoptime=new Date();
			images.loadtime=images.stoptime.getTime()-images.starttime.getTime();
		}
	}
	images[i].src=imagesSrc[i];
  }
}
//-->
</script>
CalevanMedlem sedan maj 20031 133 inlägg
#3

tack tack, det funkade fint. Nu är det så att jag visar inte bilderna direkt utan meningen är att alla ska laddas ner, och sen när man klickar på en länk så ska bilderna visas, då snabbt utan att laddas in. måste man då använda samma arrays för att läsaren ska fatta att den redan har laddat ner bilderna?

och jag får lågt virtuellt minne när jag laddar ner många bilder... är det säkert att bilderna lagras i chashen och inte i internminnet?

tack!

dapperMedlem sedan sep. 200568 inlägg
#4

i och med att den funktionen skapar nya image objekt för samtliga bilder samtidigt kommer minnesförbrukningen bli väldigt hög om du har för många bilder. Jag skulle råda dig att istället begränsa den till att först ladda upp 5 bilder, sen allt eftersom de blir färdiga anropa en funktion för att ta bort den förra bilden och påbörja en ny hämtning. Bilderna cachas som vanligt, men just DOM objekt är på detta sätt rätt krävande.. Speciellt på Mac läsare.

emissionMedlem sedan dec. 19996 095 inlägg
#5

Calevan skrev:

tack tack, det funkade fint. Nu är det så att jag visar inte bilderna direkt utan meningen är att alla ska laddas ner, och sen när man klickar på en länk så ska bilderna visas, då snabbt utan att laddas in. måste man då använda samma arrays för att läsaren ska fatta att den redan har laddat ner bilderna?

Nej, det behöver du inte, eftersom cachningen endast ser på url:en Vill du få ett (marginellt) snabbare beteende måste du använda de Image-objekt som skriptet skapar och stoppa in dem i HTML-trädet.

Calevan skrev:

och jag får lågt virtuellt minne när jag laddar ner många bilder... är det säkert att bilderna lagras i chashen och inte i internminnet?

Hur cache-mekanismen fungerar har man egentligen ingen kontroll över (dvs. till viss del utnyttjas internminnet, oavsett man vill det eller inte), men nackdelen med preload-scripten är att de skapar Image-objekt (som lagras i internminnet) som sedan aldrig utnyttjas. I princip dubblar man minnesåtgången med preloaden.

En variant skulle kunna vara att återanvända ett och samma Image-objekt för alla bilder, men då måste man se till att inte sätta om src-attributet förrän föregående bild laddats klart (triggar ett onload-event som kan vara användbart).

CalevanMedlem sedan maj 20031 133 inlägg
#6

tack båda två! det förklarar varför datorn blir så seg, ska fundera på hur jag kan göra det istället. En funktion som inte körs förrän bilden innan är färdigladdad, det låter något det, hur kan man tänkas skapa en sådan? onloadfinished, hmm.

tack!

emissionMedlem sedan dec. 19996 095 inlägg
#7

En Googling på "javascript preload onload onerror" gav denna träff

http://www.webreference.com/programming/javascript/gr/column3/

Verkar vettig!

CalevanMedlem sedan maj 20031 133 inlägg
#8

Testade koden som du föreslog emission men det allokerade minnet ökade ändå explsionsartat och därmed även växlingsfilen, dvs datorn blev seg.

Desutom så verkar det inte som preloadingen fungerar som jag tänkt. även de preloade bilderna tar lite tid innan de kommer fram. ni kan ju testa (om ni vågar :) ) att gå till denna sidan och klicka på helskärmsläge:

http://217.28.195.189/visa.asp?AlbumID=220

tack!

J.N.Medlem sedan apr. 20031 660 inlägg
#9

HEJ!

Vad är det egentligen jag provar?
Har du förladdat de stora bilderna, återanvänder du bildobjektet?

Jag provade några bilder, och eventuellt går det något snabbare.
6-7 sek för ca 4 Mb, gissar jag på.

Svårt att säga utan att ha en "normal" webb att jämföra med.

CalevanMedlem sedan maj 20031 133 inlägg
#10

Hej!

Meningen var att man skulle kunna pröva att se om det blir skillnad när man förladdat bilderna och när man inte har gjort det. Klarar din dator att förladda bilderna utan att bli tokseg? Exakt hur koden ser ut antar jag att du ser i källkoden.

jag tror att jag återavnänder bildobjektet, jag hoppas det, men är inte helt säker... ska jag posta all kod här?

tack!

J.N.Medlem sedan apr. 20031 660 inlägg
#11

HEJ!

Koden har jag inte tittat på, då jag räknar med att jag inte förstår den!
Tittade i visa.asp, vänsterframen, och där stoppar du bilderna i en array.
Men, är det inte endast småbilderna?

I vilket fall finns det inget att anmärka på, det fungerar som man kan vänta sig, eller kanske något bättre, när en stor bild ska visas.

CalevanMedlem sedan maj 20031 133 inlägg
#12

i visa.asp är det, som du säger, småbilderna som laddas in i en array. Därför gör jag en ny array på bildspel.asp (den sidan du kommer till när du klickar på helskärmsläge). För mig fungerar det ingen vidare att förladda bilderna, så jag drar igång bildspelet direkt istället. Vad menar du med att det fungerar som väntat eller lite bättre? De låter onekligen bra, men exakt vad menar du?

tack!

J.N.Medlem sedan apr. 20031 660 inlägg
#13

HEJ!

Jag tror vi har lurat varandra! :e

När du skrivitom stora bilder, har jag trott att du klickade på den stora bilden till höger. Eftersom din vänsterframe såg lite konstig ut nu, klickade jag på Helskärmsläge, och se där, det är säkert DEN du talat om.

Den fungerar däremot dåligt, där ser man hur den laddar tunga bilder.
Har man för kort bildspelstid kommer inte bilden fram. Testade med 30 sek, men fungerade inte ändå.

Eftersom den stora bilden som jag tittat på tidigare är en direktlänkad jpg-fil, fick jag inte ihop hur du förladdat den bilden.
Därför skrev jag också att det fungerade bra.

CalevanMedlem sedan maj 20031 133 inlägg
#14

ah, det förklarar saken! ber om ursäkt att jag varit otydlig i min beskrivning.

Jag får fram bilderna fint på 10 sekunder, men datorn hänger sig ganska mycket om man väljer att förladda bilderna där. Du får gärna testa att göra det (finns en länk i löptexten på helskärmsläget) och berätta om det går eller inte.

(kontrollerna ser inte helt korrekt ut grafiskt just nu, har inte hunnit fixa det ännu)

tack!

J.N.Medlem sedan apr. 20031 660 inlägg
#15

HEJ!

Calevan skrev:

Jag får fram bilderna fint på 10 sekunder, men datorn hänger sig ganska mycket om man väljer att förladda bilderna där. Du får gärna testa att göra det (finns en länk i löptexten på helskärmsläget) och berätta om det går eller inte.

Nä? Jag har endast start/stopp och "Stäng bildspel", ingen löptext alls.

Jag har alltså klickat på Helskärmsläge i vänsterframen, då öppnar sig en helsvart sida med menyn gömd till vänster.

CalevanMedlem sedan maj 20031 133 inlägg
#16

Du menar att det inte ser ut som min bild nedan? Med massa text på mitten och en meny precis så som du beskriver det?

bildspel.JPG
J.N.Medlem sedan apr. 20031 660 inlägg
#17

HEJ!

Nej, inte i IE, men i Firefox fungerar det bra. Det kunde jag ju påpekat...
IE visar maximerat fönster, helsvart, med vänsterflik.

I vilket fall provade jag titta i FF, och det flyter bra med 10 sek, då hinner man se bilden 0.5-3 sek innan den byts beronde på hur stor bilden är.

CalevanMedlem sedan maj 20031 133 inlägg
#18

tack så mycket! av någon anledning fungerar det bara i FireFox, men jag låter det vara så!

Genererad på 388 ms · cache AV · v20260730165559-full.f96bc7eb