{flush}
Sends the page rendered so far to the browser at once, so it can load the stylesheets while a slow part below renders.
Syntax
{flush}Description
{flush} sends what has been rendered above it to the browser now, instead of with the rest when the whole page is done. Put after the wrapper's </head>, it lets the browser fetch the stylesheets, scripts and fonts the head names while a slow part of the page - a large table, a remote fetch - is still rendering. The page's PHP runs before any of the template, so what a flush wins is the rendering below it.
The first flush switches off, for that request, everything that needs the whole body at once: tidy, gzip of the whole body, the ETag and its 304, Content-Length and the page cache. The headers go out with the first part, so a header or cookie set after the flush is lost. A {stack} in the part already sent gets only the pushes made before the flush.
It stands at the top level of the page or its wrapper. Inside another tag, or in a page whose PHP returns data, the strict check reports it. In a page rendered inside another (a {page}), for an output type other than web, and in a request answered with one fragment or the post of a live region, it does nothing - which is why the example is shown rather than run.
Examples
After the head of the wrapper
In _inits.pad: the head goes out at once, and the browser loads site.css while the page renders.
<!DOCTYPE html>
<html>
<head>
<title>{$title}</title>
<link rel="stylesheet" href="{asset 'site.css'}">
</head>
{flush}
<body>
@page@
</body>
</html>