3

我正在尝试使用“PushPromise”.NET 4.6.1 实现 Http2 推送服务器功能，为此我有一个带有 Razor 的“html 扩展”（我们没有实现 MVC，只使用 Razor 引擎来构建页面）。

    public static IHtmlString PushPromiseStylesheet(this HtmlHelper htmlHelper, string src, bool addDomElement = true)
    {
        var context = HttpContext.Current;
        var path = System.Web.Optimization.Styles.Url(src).ToString();

        var headers = new NameValueCollection { { "accept-encoding", context.Request.Headers["accept-encoding"] } };
        context.Response.PushPromise(path, "GET", headers);

        var styleElement = $"<link rel=\"preload\" href=\"{path}\" as=\"style\">";

        return new HtmlString(addDomElement ? styleElement : String.Empty);
    }

    public static IHtmlString PushPromiseJavascript(this HtmlHelper htmlHelper, string src)
    {
        var context = HttpContext.Current;
        var path = System.Web.Optimization.Scripts.Url(src).ToString();

        var headers = new NameValueCollection { { "accept-encoding", context.Request.Headers["accept-encoding"] } };
        context.Response.PushPromise(path,"GET",headers);

        var javascriptElement = $"<link rel=\"preload\" href=\"{path}\" as=\"script\">";

        return new HtmlString(javascriptElement);
    }
    public static IHtmlString PushPromiseImage(this HtmlHelper htmlHelper, string src, bool addDomElement = false)
    {
        var context = HttpContext.Current;
        var path = System.Web.Optimization.Scripts.Url(src).ToString();

        var headers = new NameValueCollection { { "accept-encoding", context.Request.Headers["accept-encoding"] } };
        context.Response.PushPromise(path,"GET",headers);

        var imgElement = $"<link rel=\"preload\" href=\"{path}\">";

        return new HtmlString(addDomElement ? imgElement : String.Empty);
    }

    public static IHtmlString PushPromiseWebFont(this HtmlHelper htmlHelper, string src, string type = null)
    {
        var context = HttpContext.Current;
        var path = System.Web.Optimization.Scripts.Url(src).ToString();
        type = string.IsNullOrWhiteSpace(type) ? "font/woff2" : type;

        var headers = new NameValueCollection { { "accept-encoding", context.Request.Headers["accept-encoding"] } };
        context.Response.PushPromise(path, "GET", headers);

        var fontElement = $"<link rel=\"preload\" href=\"{path}\" as=\"font\" type=\"{type}\"> ";

        return new HtmlString(fontElement);
    }

而在页面的<head>中：

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<title>@Page.Title</title>
@Html.PushPromiseStylesheet("~/css/app/fonts.css")
@Html.PushPromiseStylesheet("~/css/landing.base.css")
@Html.PushPromiseStylesheet("~/css/landing.style.css")
@Html.PushPromiseImage("/assets/img/bg-ofertas.jpg")
@Html.PushPromiseImage("/assets/img/landings/v2/iphone.png")
@Html.PushPromiseImage("/assets/img/landings/v2/ipad-new.png")
@Html.PushPromiseImage("/assets/img/landings/v2/macbook-new.png")

@Html.PushPromiseWebFont("/assets/fonts/CredimejoraIcons.woff2?miydpz")
@Html.PushPromiseWebFont("/assets/fonts/centrale_sans_regular_italic-webfont.woff2")
@Html.PushPromiseWebFont("/assets/fonts/centrale_sans_bold_italic-webfont.woff2")
@Html.PushPromiseWebFont("/assets/fonts/centrale_sans_regular-webfont.woff2")
@Html.PushPromiseWebFont("/assets/fonts/centrale_sans_bold-webfont.woff2")

@Html.PushPromiseJavascript("/assets/js/public/libs/jquery.inputmask.bundle-3.3.6.2.js")

我已经“不使用 PushPromise”（credimejorademo）托管了同一个项目，并且在另一个域中我实现了 PushPromise（aquituinmueble）：

演示(credimejorademo) | Demo2 (aquituinmueble)

https://www.webpagetest.org/video/compare.php?tests=170609_PD_e32f303e034aef3fef7140fef181a738,170609_FK_7d538ecdacf071cce320ad14bf97414c

4

1 回答 1

1

我在这里只提几件事。首先，虽然这可能看起来违反直觉，但你最好不要推动 -everything-。我见过的有限数量的测试（例如：https ://www.smashingmagazine.com/2017/04/guide-http2-server-push/ ）表明仅推送 css 可能是提高性能的最佳方法，尽管值得在单个站点上使用。

另一件事是您实现 PushPromise 的方式意味着 IIS 仅在它已经开始处理页面后才获取该请求。即，您请求推送的时间或多或少与页面通过标准 .

希望这可以帮助。

于 2017-07-04T09:21:28.030 回答