Bildschirmflackern bei Antwort.redirect

Question

Ich habe ein Problem, bei dem der Bildschirm bei einer Weiterleitung beim Rendern der neuen Seite für eine Millisekunde weiß wird.

Das führt zu einem Flackern des Bildschirms und ärgert mich sehr.

Ich habe mich ein wenig im Internet umgesehen und diese IE-Lösung gefunden, die im IE funktioniert, aber nicht in Chrome oder FireFox.

<meta http-equiv="Page-Enter" content="blendTrans(Duration=0.0)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0.0)" />

Außerdem bin ich sicher, dass die Verwendung dieser Methode einige Auswirkungen auf Update-Panels und Ajax-Steuerelemente haben wird.

Gibt es eine Möglichkeit, den Server so einzustellen, dass er die gesamte Seite rendert, bevor er sie an den Client weitergibt, um nicht diese weiße Millisekunde zu haben, die bei allen Browsern funktioniert.

Jede Idee ist willkommen.

Answer 1

Die MSDN-Beispiele empfehlen die Einstellung

Response.BufferOutput

vor dem Aufruf

Response.Redirect("http://www.mydomain.com/default.aspx");

Sie können auch versuchen, Folgendes zu verwenden

Server.Transfer("default.aspx", true);

Answer 2

Was Sie sehen, ist ein normales Phänomen. Folgendes passiert bei einer Weiterleitung:

• Der Server sendet eine Antwort an den Browser (Weiterleitungen werden auf der Client-Seite vorgenommen).
• Der Browser lädt die Antwort, stellt fest, dass es sich um eine Weiterleitung handelt und stoppt das Laden der Seite
• Der Browser lädt die neue Seite

Die Meta-Tags, die Sie verwenden, gelten nur für den IE und haben keine Auswirkungen auf andere Browser. Die einzigen Dinge, die das Flimmern ganz beseitigen, sind eine der folgenden Maßnahmen:

1. Sie sagten, dass die Umleitung erfolgt, wenn der Benutzer auf eine Schaltfläche oder auf eine Rasterzeile oder etwas anderes klickt. Wenn dies eine Änderung an location.href anstelle eines Post-Back auslösen würde, dann würde der Benutzer nicht sehen, den Browser flackern.

2. Utilisez Server.Übertragung (dies führt dazu, dass in der Adressleiste des Browsers die alte Seite anstelle der neuen Seite angezeigt wird (eine Weiterleitung ändert die Adressleiste). Dies funktioniert nur, wenn Sie den Benutzer auf eine Seite auf demselben Server umleiten.

3. Senden Sie eine HTTP 301 Antwort (Dauerhaft verschoben). Damit wird das Flimmern beseitigt, aber diese Methode ist mit Vorsicht zu genießen. Sie hat andere Auswirkungen (sie kann die Platzierung in Suchmaschinen beeinflussen).

Für die Nummer 3 verwenden Sie diesen Code auf dem Server.

Response.StatusCode = 301;
Response.StatusDescription = "Moved Permanently";
Response.AddHeader("Location", "NewLocation.aspx");

Answer 3

Gibt es eine Möglichkeit, den Server so einzustellen, dass er die gesamte Seite rendert, bevor er sie an den Client weitergibt?

Kurze Antwort: Nein. So funktioniert ein Webbrowser.

sogar mit den schnellsten möglichen Servern (mit statisch gecachten Seiten, wie Sie sie beschreiben), verringern Sie nur die durchschnittliche "weiße" Zeit, nicht beseitigen sie ganz zusammen. wie Sie mit IE sehen, ist dieser Standardseitenübergang ein Teil des Browsercodes, nicht etwas, das die Serverseite Steuerung über erhält. wenn Sie Ihren eigenen Browser schreiben, können Sie ihn schreiben, um schwarz zu waschen, weiß zu waschen, oder den Übergang zu halten, bis die gesamte Seite geladen ist, wie IE tut.

Diese Zeit ist nicht nur die Zeit, die der Server braucht, um die Seite zu generieren, sondern auch die gesamte Netzwerklaufzeit für die Seite, Bilder, Javascripts, CSS usw. Deshalb kann man sie nie ganz loswerden, sondern nur mit Browsertricks verbergen.

und ich spreche nicht von "client-seitigem" irgendetwas. das wird nicht funktionieren. der "client-seitige" code wird nicht einmal heruntergeladen, geschweige denn ausgeführt, wenn der browser beschließt, die leinwand weiß zu waschen. es ist eine art standardteil des "internet", an den sich jeder gewöhnt; es wurde nicht entworfen, um ein Diashow-Betrachter oder ein grafisch perfekter Renderer zu sein. leider, wenn Sie sich so sehr um Übergänge kümmern, ist HTML wahrscheinlich nicht das richtige Medium für Ihre Arbeit.

Answer 4

Standardmäßig puffert der Server die gesamte Antwort, bevor er sie sendet. Das "Weiß" ergibt sich aus dem Inhalt der HTML-Datei, möglicherweise aus ihrer Größe. Verwenden Sie ein Tool wie Firebug oder die IE Developer Tools (meine Präferenz ist Fiddler ), um den generierten Inhalt zu untersuchen. Bei einer Vermutung haben Sie einige sehr große ViewState.

Answer 5

Entschuldigung, bin spät dran! Ich kämpfe schon seit langem mit diesem Problem bei meinen Anwendungen. Die Lösung, die ich entwickelt habe, funktioniert für mich. Sehr ähnlich wie das, was @Pike65 vorgeschlagen hat...

1. Erstellen Sie einen Halter für ein Overlay:

<div id="overlayContent" class="overlay">
    <div id="loaderContent" class="loader">
        Loading...
    </div>
</div>

1. CSS für diesen Halter:

.overlay {
    position: fixed;    
    border: 0; margin: 0; padding: 0;
    height: 100%; width: 100%;
    top: 0; left: 0;
    background-color: #272727;
    text-align: center; vertical-align: middle;
    z-index: 900; display: none;
    -moz-opacity: 0.1; opacity: 0.1;
    filter: alpha(opacity=10);
}

.overlay .loader {
    position: relative;
    width:40%;
    margin: 20% auto;
    padding: 10px;
    background-color:black;
    border: solid 1px gray;
    color: #cccccc;
    font-weight: bold;
}

1. Javascript (jQuery):

$('a, input[type=button]').live("click", function (e) { 
    $("#overlay").show().css({ opacity: 0.1 }).fadeTo(UxSpeed, 0.8); 
});

Das war's. Sie können die "js" nach Ihren Wünschen ändern. Es wird ein durchsichtiges Overlay erscheinen, sobald ein Link oder eine Schaltfläche angeklickt wird. Es liegt in der Natur des Browsers, dass er wartet, bis er eine Antwort auf die neue Seite erhält (Header). Die aktuelle Seite wird also nicht verschwinden, bevor nicht wenigstens etwas für die neue Seite zurückgegeben wird. Sobald die neue Seite angezeigt wird, wird das Overlay automatisch entfernt!