From f43ddc992ee2e64981125bd95f2b0d31a8255e4d Mon Sep 17 00:00:00 2001 From: Simon Lydell Date: Sun, 26 Jan 2025 11:48:59 +0100 Subject: [PATCH 1/2] Avoid unnecessary rerenders at init --- generator/src/pre-render-html.js | 10 +++++----- src/AriaLiveAnnouncer.elm | 1 + src/Pages/Internal/Platform.elm | 4 +++- src/Pages/Internal/Platform/Cli.elm | 3 ++- 4 files changed, 11 insertions(+), 7 deletions(-) diff --git a/generator/src/pre-render-html.js b/generator/src/pre-render-html.js index 5bb012044..043b3d817 100644 --- a/generator/src/pre-render-html.js +++ b/generator/src/pre-render-html.js @@ -48,11 +48,11 @@ export function templateHtml(devMode, userHeadTagsTemplate) { ${indent(userHeadTagsTemplate({ cliVersion: packageVersion }))} - -
- - -`; +
`; + // NOTE: The above line needs to: + // - Be in sync with `view` in Platform.elm (render the same elements). + // - Not include any extra whitespace. Even whitespace between and is parsed by browsers as a text node _inside_ . + // This is to avoid unnecessary rerenders on init (when the first `view` call is diffed with the virtualized form of the above HTML). } /** diff --git a/src/AriaLiveAnnouncer.elm b/src/AriaLiveAnnouncer.elm index ec9af5a44..940cfaeef 100644 --- a/src/AriaLiveAnnouncer.elm +++ b/src/AriaLiveAnnouncer.elm @@ -17,6 +17,7 @@ view title = mainView : String -> Html msg mainView title = + -- NOTE: If you make changes here, also update pre-render-html.js! Html.div [ Attr.id "elm-pages-announcer" , Attr.attribute "aria-live" "assertive" diff --git a/src/Pages/Internal/Platform.elm b/src/Pages/Internal/Platform.elm index fe525bec1..a93ab3309 100644 --- a/src/Pages/Internal/Platform.elm +++ b/src/Pages/Internal/Platform.elm @@ -123,6 +123,7 @@ view config model = in { title = title , body = + -- NOTE: If you make changes here, also update pre-render-html.js! [ onViewChangeElement model.url , AriaLiveAnnouncer.view model.ariaNavigationAnnouncement ] @@ -136,9 +137,10 @@ onViewChangeElement currentUrl = -- it is used from the JS-side to reliably -- check when Elm has changed pages -- (and completed rendering the view) + -- NOTE: If you make changes here, also update pre-render-html.js! Html.div [ Attr.attribute "data-url" (Url.toString currentUrl) - , Attr.attribute "display" "none" + , Attr.style "display" "none" ] [] diff --git a/src/Pages/Internal/Platform/Cli.elm b/src/Pages/Internal/Platform/Cli.elm index 5d73a71fd..f2f2500a2 100644 --- a/src/Pages/Internal/Platform/Cli.elm +++ b/src/Pages/Internal/Platform/Cli.elm @@ -1025,7 +1025,8 @@ render404Page config sharedData isDevServer path notFoundReason = bodyToString : List (Html msg) -> String bodyToString body = - body |> List.map (HtmlPrinter.htmlToString Nothing) |> String.join "\n" + -- NOTE: Don’t join the strings with a newline here – see pre-render-html.js. + body |> List.map (HtmlPrinter.htmlToString Nothing) |> String.concat urlToRoute : ProgramConfig userMsg userModel route pageData actionData sharedData effect mappedMsg errorPage -> Url -> route From 76bb8257cdbda876ad3f8c38dcef75375c868fb1 Mon Sep 17 00:00:00 2001 From: Dillon Kearns Date: Sun, 26 Jan 2025 08:20:33 -0800 Subject: [PATCH 2/2] Update HTML snapshot for new pre-rendering template. --- examples/escaping/dist/escaping/index.html | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/examples/escaping/dist/escaping/index.html b/examples/escaping/dist/escaping/index.html index 81a53f706..84af70a45 100644 --- a/examples/escaping/dist/escaping/index.html +++ b/examples/escaping/dist/escaping/index.html @@ -13,8 +13,4 @@ - -
-

Hello! 2 > 1

<script></script> is unsafe in JSON unless it is escaped properly.<script></script> is unsafe in JSON unless it is escaped properly.
  • This is number 0
  • This is nested number 0
- - \ No newline at end of file +

Hello! 2 > 1

<script></script> is unsafe in JSON unless it is escaped properly.<script></script> is unsafe in JSON unless it is escaped properly.
  • This is number 0
  • This is nested number 0
\ No newline at end of file