Einzelnen Beitrag anzeigen
  #89 (permalink)  
Alt 20-06-2013, 00:30
Melewo
 Registrierter Benutzer
Links : Onlinestatus : Melewo ist offline
Registriert seit: Jan 2013
Beiträge: 365
Melewo befindet sich auf einem aufstrebenden Ast
Standard

Ich konnte das gar nicht mit ansehen, wie langsam die Startseite vom Nachrichtentisch ladet. Habe mal etwas probiert und gebastelt, wie es schneller gehen würde. Ist jedoch noch keine ausgereifte Lösung, nur erst einmal ein Test.

Also, den PHP Code raus aus den Seiten und in eine kleine Datei packen. Im Beispiel die feeds.php, in der wie gehabt die funktionen.php includet wird:

PHP-Code:
<?php
ini_set
("user_agent""Mozilla/5.0 (compatible; Feedreader/PHP +".$_SERVER["HTTP_HOST"].$_SERVER["PHP_SELF"].")");
header("Content-Type: text/html; charset=UTF-8");
error_reporting(E_ALL);

$feedfu "funktionen.php";           // Seite mit den Funktionen

if (file_exists($feedfu)) {include_once $feedfu;
} else {echo 
"Feedfunktionen konnte nicht geladen werden!\n";
}

// Feed-Adressen aufnehmen und nummerieren

$feedurls = array (

    
=> "www.tagesschau.de/xml/atom/",
    
=> "www.spiegel.de/wirtschaft/index.rss",
    
=> "rss2.focus.de/c/32191/f/443313/index.rss",
    
=> "www.heise.de/developer/rss/news-atom.xml"
);

if (isset(
$_GET["feedid"]) and !empty($_GET["feedid"])) {

    
$feedid preg_replace("/[^0-9]/"""$_GET["feedid"]);
    
verarbeiteFeed("http://".$feedurls[$feedid]);
}
?>
In den eigentlichen HTML-Seiten dann Ajax-Funktionen:

HTML-Code:
<!DOCTYPE html>
<html>

<head>
<title>Feedreader</title>
<link rel="stylesheet" type="text/css" href="feedstyle.css">
</head>

<body>
<h1>Feedreader für RSS und Atom</h1>

<script type="text/javascript">

var feedObj = null;
    feedObj = new XMLHttpRequest();
var i = 1;

window.onload = function() {

    function beginneLaden() {

        feedObj.open("GET", "feeds.php?feedid="+i);
        feedObj.onreadystatechange = ladeFeeds;
        feedObj.send(null);

        function ladeFeeds() {

            var fa = false;
            var anzahl = 5;      // Anzahl der Feeds angeben

            if (feedObj.readyState == 4) {
                document.getElementById("feed"+i).innerHTML += feedObj.responseText;
                i++;
                fa = true;
                if (i > anzahl) {fa = false;
                }
            }
            if (fa != false) {

                beginneLaden();
            }
        }
    }
    beginneLaden();
}
</script>

<!--
 Hier so viele Div-Bereiche im Dokument anlegen und mit einer ID versehen,
 wie Feeds in der Seite geladen werden sollen.
-->
<div id="feed1"></div>
<div id="feed2"></div>
<div id="feed3"></div>
<div id="feed4"></div>
</body>
</html>
Prinzip: Zuerst wird ein einzelner Request gestartet, doch so wie die Daten des ersten Feeds übertragen wurden (readyState == 4), wird die i um eins erhöht und die Funktion erneut aufgerufen. Wenn der erste Feed ein schneller ist, ist auch sehr schnell etwas zu sehen und die restlichen folgen dann, erkennbar daran, dass der Scrollbalken kürzer wird, weil die Seite länger wird.

Der Nachteil, die Seite enthält keinen für Suchmaschinen verwertbaren Content mehr. Eine Alternative wäre, zuerst die schnellen mit PHP zu laden, die langsamen dann per Ajax zusätzlich.

Edit: Habe mal ein kleines Demo mit 5 Feeds angefertigt, damit Du den Unterschied beim Laden einer Seite siehst:

Nur ein Demo - Feeds laden mit Ajax

Also, nach einer halben Sekunde ist die Seite zu sehen, dann folgen die Feeds. Finde ich für Besucher einer Seite angenehmer.

Geändert von Melewo (20-06-2013 um 15:59 Uhr)
Mit Zitat antworten