Nach html Seitenaufbau javascript hinzufügen

aherzog

Erfahrenes Mitglied
Hallo miteinander.

Ich habe eine Seite aufgebaut die Infos zu div. Aufträgen anzeigt.

Der Aufbau dieser Seite dauert für 1900 Aufträge geschlagene 26 Sekunden !!.

Das Problem liegt in den Javascript-Eventhandler (onclick)
Entferne ich dies wird die Seite in 3 Sekunden geladen. Was ich als akzeptabel erachte.

Ich habe vorher dannach gesucht und wurde fündig. Dort kamm ich erst auf die Idee die Eventhandler mal zu entfernen.
Der Author schrieb von einer Möglichkeit das man die Eventhandler nach dem Aufbau der HTML-Seite nachträglich per Javascript einfügen könne, erklärte dies aber nicht weiter.

Deshalb meine Frage an die Javascript-Spezialisten.
Wie funktioniert so etwas, oder geht das gar nicht ?

Wäre echt froh wenn mir da jemand einen Tip hätte wie ich das programmieren kann.

Danke und Gruss Andreas
 
Zuletzt bearbeitet:
Der Beschreibung nach hat er z.B. eine Tabelle von Aufträgen und erstellt beim Durchlaufen der while-Schleife, womit er die Tabelle füttert, für jeden Eintrag selber einen javascript-Code. Das habe ich auch schon so gemacht. Allerdings könntest du den Code sicherlich irgendwie verallgemeinern. Also zeig einfach mal her das gute Stück.

Anderes Thema: Wieso lässt du 1900 Einträge auf einer Seite anzeigen, statt diese auf mehrere Seiten zu verteilen? Stichwort Pagination.
 
Zuletzt bearbeitet:
Danke für eure Hilfe.

Hier also der Code.

HTML:
<html>
<header>
<title>PRA verwalten</title>
<style type="text/css">
 #table_m {border:solid 1px #000000; border-collapse:collapse; font-family:Arial; font-size:11;}
 #table_o {border:solid 0px #000000; border-collapse:collapse; font-family:Arial; font-size:11;}
 #th { border:1px solid black; }
 #td { border:1px solid black;}
 input {font-size:9;}
 #input_s {width=12; align:center; border-width:0px;}
 </style>
 <script type="text/javascript">
function edit_window(pra) 
{
  fenster = window.open('pra_edit.php?pra='+pra, 'Fenster', 'width=400, height=330,  scrollbars=no, top=300, left=400');
  fenster.focus();
}
function open_window_newpra() 
{
	fenster = window.open('pra_new.php', 'Fenster', 'width=400, height=430, scrollbars=no, top=300, left=400');
	fenster.document.bgColor = "Gainsboro";
	fenster.focus();
}
function report_open(pra)
{
	URL='rep_interim_report.php?pra='+pra;
	window.location=URL;
}
</script>
 </header>
<body>

<?php
$nr = $_GET[user];
// MYSQL-Connect
$mysql_user = "xxxx";
$mysql_pwd = "xxxx";
$mysql_host = "xxxx";
$mysql = mysql_connect($mysql_host, $mysql_user, $mysql_pwd);
mysql_select_db('prod');


if (isset($_GET[close]))
{
	foreach ($close as $key => $val)
	{
		$data_pra = substr($key,0,strpos($key,'-'));
		$data_status = substr($key,strpos($key,'-')+1,1);
	}
	if ($data_status == 0)
		mysql_query("UPDATE pra SET status = '1' WHERE pra = '$data_pra'");
	else
		mysql_query("UPDATE pra SET status = '0', cdate = '".date('Y-m-d')."' WHERE pra = '$data_pra'");
		
	$url = $_SERVER['REQUEST_URI']; 
	if(preg_match("/Abschliessen/",$url)) 
	{
		echo "<script type='text/javascript'>";
		echo "URL='rep_pra_close.php?pra=".$data_pra."';";
		echo "window.location=URL;";
		echo "</script>";
	}
}

// Tabellentitel
echo "<form>";
echo "<table id=table_m align=center>";
echo "<colgroup>";
echo "<col width=70>";	// Prozess_nr
echo "<col width=120>";	// Mat_nr
echo "<col width=300>";	// Mat_bezeichnung
echo "<col width=150>";	// Mat_info
echo "<col width=50>";	// Fert.-St.
echo "<col width=125>";	// Edit
echo "</colgroup>";
echo "<tr>";
echo "<th id=th><a href=pra.php".$link."&order=pra>Prozess-Nr.</a></th>";
echo "<th id=th><a href=pra.php".$link."&order=mat_nr>Mat.-Nr.</a></th>";
echo "<th id=th><a href=pra.php".$link."&order=mat_bez>Material-Bezeichnung</a></th>";
echo "<th id=th><a href=pra.php".$link."&order=mat_info>Mat.-Info.</a></th>";
echo "<th id=th><a href=pra.php".$link."&order=vs>Fert.-St.</a></th><th id=th>Edit</th>";
echo "</tr>";
// Tabelleninhalt
	$stat = "SELECT pra, mat_nr, mat_info, status, mat_bez, vs FROM pra";           


$found = mysql_query($stat);
while ($data = mysql_fetch_row($found))
{
	if ($data[3] == 0)
	{
		$color = "Red";
		$disable = "disabled=disabled";
	}
	else
	{
		$color = "";
		$disable = "";
	}
	$status = $data[0]."-".$data[3];	
	
	// Materialbezeichnung wrappen
	$wrap_text = wordwrap($data[4], 40, "\n", true);

	echo "<tr><td id=td><font color=".$color.">$data[0]</font>";
	echo "<img src='info.png' width='14' height='14' onclick=report_open('$data[0]')>";
	echo "</td><td id=td><font color=".$color.">$data[1]</font></td><td id=td><font color=".$color.">$wrap_text</font></td><td id=td><font color=".$color.">$data[2]</font></td><td id=td><font color=".$color.">$data[5]</font></td><td>";
	echo "<input type=button name=edit value=Edit onclick=edit_window('$data[0]') ".$disable.">";
	if ($data[3] == 1)
	{	
		echo "<input type=submit name=close[$status] value=Abschliessen>"; 
	}
	else
	{
		echo "<input type=submit name=close[$status] value='Neu eröffnen'>";
	}
	echo "</td></tr>";
}
echo "</table>";
echo "</form>";
?>
</body>
</html>
 
Ich habe heute noch was anderes Versucht.
Doch leider hat das gar keinen Einfluss auf die Ladezeit.
Es geht genau gleich lang wie vorher.

Meine Idee war alle Javascript-Befehle aus der Funktion zu nehmen und direkt in die Zeile schreiben. Also das aufrufen der Funktion zu umgehen.

Vor dem Umbau:
PHP:
echo "<img src='info.png' width='14' height='14' onclick=report_open('$data[0]')>";

Nachher
PHP:
echo "<img src=\"info.png\" width=\"14\" height=\"14\" onclick=\"window.location='rep_interim_report.php?pra=$data[0];\">";

Wie funktioniert den das nachträgliche einfügen von Javasript genau ?
 
Ich bin mir nicht sicher, aber aus meiner Sicht hat das wenig mit dem Javascript-Teil zu tun. Soviel Traffic verursacht der auch nicht und er ist sogar schon "verallgemeinert", also du hast nicht für jedes Element ein neues Event.
Ich bin mir nicht sicher, aber am JS liegt es eher nicht!

Hast du mal versucht nicht alles direkt auszugeben, sondern zuerst alle Outputs in eine Variable zu speichern und am Ende der Seite auszugeben?
PHP:
$output = "";
while($row = mysql_fetch_object($qry))
{
    $output .= "<html tag>{$row->data}</html tag>";
}
echo $output;
 
Zuletzt bearbeitet:
Hmm. hab ich bis jetzt nicht versucht...
Das würde aber ein etwas grösserer Umbau verursachen.

Mein erster Test den ich gemacht habe (alle onclick entfernt) hat ja eine kürzung von 26 auf 6 Sekunden gebracht. Deshalb wäe ich schon der Meinung das es am Javascript liegt. Oder liege ich da völlig falsch?

Ich würde schon gerne wiessen woran es genau liegt befor ich da ein kompletter Umbau mache, und dieser am Schluss nichts bringt.
 
Ich sags mal so: Javascript wird vom Client (PC, Browser) ausgeführt. Wenn der zu lang braucht das alles zu interpretieren, dann liegts an dem. Glaub ich aber nicht, weil ein Browser normalerweise ziemlich schnell ist.
Die Ausgabe von PHP hat damit weniger zu tun, das ist nur ein bisschen mehr Traffic, aber lang nicht das doppelte oder gar 4-5fache.

Der Umbau sollte nicht all zu groß sein? Einfach die Echos durch eine Variable ersetzen und diese am Ende ausgeben!
 
So...
habs ausprobiert.

Alle echo's entfernt und in die $output - Variable geschrieben.
Hat leider nix gebracht.
War sogar noch ne Sekunde länger (=27 Sekunden).

Was kann ich noch probieren?
 

Neue Beiträge

Zurück