---
title: Adding A Splash Screen
order: 85
layout: page
---

[[adding-a-splash-sreen]]
= Adding a splash screen

When a Vaadin application is loading a loading indicator is
automatically shown so the user knows something is happening. But what
if we want to show something else, like a custom splash screen for our
product? Or just customize the loading indicator? Let's have a look.

During the Vaadin bootstrap there are a couple of div elements added to
the page which we can use for our custom splash screen. The DOM for a
servlet application looks the like the following when starting up:

[source,html]
....
<body scroll="auto" class="v-generated-body">
  <div id="splash-895866265" class="v-app splash">
    <div class="v-app-loading"></div>
    <noscript>
    You have to enable javascript in your browser to use an application built with Vaadin.
    </noscript>
  </div>
....

In this example _splash_ is the name of our theme. The _v-app-loading_
div is meant for styling the loading screen. It will only exist in the
DOM until the widget set has been loaded and the application starts. At
that point the _v-app-loading_ div is removed and replaced by the actual
components for the application.

Styling the loading screen is then as simple as adding some rules for
_v-app-loading_, for example:

[source,scss]
....
.v-generated-body &.v-app .v-app-loading {
  height: 100%;
  width: 100%;
  background-image: url(http://archive.eclipse.org/eclipse/downloads/drops/R-3.3-200706251500/whatsnew/images/splash.png);
  background-repeat: no-repeat;
  background-position: 50%;
}
....

This will use an Eclipse logo as your splash screen - change the
background image to your own splash screen or redesign the css
completely to your liking.

*Note that Vaadin 7.0 incorrectly does not add the theme name during
bootstrap. You must therefore use a rule without the theme name, e.g.
`.v-generated-body .v-app .v-app-loading` and move it out of the
@mixin. You also need to ensure the v-app div has a height using
`.v-app {height:100%;}`*

<option value='changelog-8.27.1'>changelog-8.27.1</option>
<option value='changelog-8.27.2'>changelog-8.27.2</option>
<option value='changelog-8.27.3'>changelog-8.27.3</option>
<option value='changelog-8.27.4'>changelog-8.27.4</option>
<option value='changelog-8.27.6'>changelog-8.27.6</option>
<option value='changelog-8.28.1'>changelog-8.28.1</option>
<option value='chore-mention-8.14.4'>chore-mention-8.14.4</option>
<option value='chore-readme-8-14-4'>chore-readme-8-14-4</option>
<option value='context-menu'>context-menu</option>
<option value='datefield-set-invalid-value'>datefield-set-invalid-value</option>
<option value='declarative'>declarative</option>
<option value='dependabot/maven/org.eclipse.jetty-jetty-server-10.0.14'>dependabot/maven/org.eclipse.jetty-jetty-server-10.0.14</option>
<option value='dependabot/maven/org.eclipse.jetty-jetty-webapp-9.4.44.v20210927'>dependabot/maven/org.eclipse.jetty-jetty-webapp-9.4.44.v20210927</option>
<option value='dependabot/maven/org.eclipse.jgit-org.eclipse.jgit-3.5.3.201412180710-r'>dependabot/maven/org.eclipse.jgit-org.eclipse.jgit-3.5.3.201412180710-r</option>
<option value='dependabot/maven/org.eclipse.jgit-org.eclipse.jgit-7.2.1.202505142326-r'>dependabot/maven/org.eclipse.jgit-org.eclipse.jgit-7.2.1.202505142326-r</option>
<option value='dependabot/maven/org.hsqldb-hsqldb-2.7.1'>dependabot/maven/org.hsqldb-hsqldb-2.7.1</option>
<option value='documentation'>documentation</option>
<option value='documentation-7.6'>documentation-7.6</option>
<option value='downgrade-snapshot-version-20241105'>downgrade-snapshot-version-20241105</option>
<option value='exclude-element-screenshot'>exclude-element-screenshot</option>
<option value='feature/atmosphere-pure-javascript'>feature/atmosphere-pure-javascript</option>
<option value='feature/bootstrap-annotation'>feature/bootstrap-annotation</option>
<option value='feature/combobox-communication'>feature/combobox-communication</option>
<option value='feature/dalvik'>feature/dalvik</option>
<option value='feature/databinding'>feature/databinding</option>
<option value='feature/dnd'>feature/dnd</option>
<option value='feature/elements'>feature/elements</option>
<option value='feature/eventbus'>feature/eventbus</option>
<option value='feature/karaf-feature-file'>feature/karaf-feature-file</option>
<option value='feature/nullrepresentation'>feature/nullrepresentation</option>
<option value='feature/standard-gwt'>feature/standard-gwt</option>
<option value='feature/standard-sass'>feature/standard-sass</option>
<option value='feature/vaadin8'>feature/vaadin8</option>
<option value='feature/vaadin8-book'>feature/vaadin8-book</option>
<option value='feature/vaadin8-book-vol2'>feature/vaadin8-book-vol2</option>
<option value='feature/vaadin8-sass-valo-only'>feature/vaadin8-sass-valo-only</option>
<option value='fileToFilesReplacement'>fileToFilesReplacement</option>
<option value='fix11576'>fix11576</option>
<option value='fix_event_router_prototype'>fix_event_router_prototype</option>
<option value='grid'>grid</option>
<option value='grid_dnd_autoscroller'>grid_dnd_autoscroller</option>
<option value='grid_dragger'>grid_dragger</option>
<option value='issue/8307_select_using_collection'>issue/8307_select_using_collection</option>
<option value='master'>master</option>
<option value='mobile_drag_image_offset'>mobile_drag_image_offset</option>
<option value='pr/11306'>pr/11306</option>
<option value='remote-run/flow-atmosphere-test'>remote-run/flow-atmosphere-test</option>
<option value='snapshot/7.5'>snapshot/7.5</option>
<option value='snapshot/7.6'>snapshot/7.6</option>
<option value='tmattsso-patch-1'>tmattsso-patch-1</option>
<option value='update-minor-deps'>update-minor-deps</option>
<option value='vaadin-icons-3.0.1'>vaadin-icons-3.0.1</option>
<option value='wip-date-time-datatype'>wip-date-time-datatype</option>
<option value='wip-java-10-compat'>wip-java-10-compat</option>
</select> <input type='submit' value='switch'/></form></td></tr>
<tr><td class='sub'>Vaadin 6, 7, 8 is a Java framework for modern Java web applications: https://github.com/vaadin/framework</td><td class='sub right'>www-data</td></tr></table>
<table class='tabs'><tr><td>
<a href='/vaadin-framework.git/about/?h=8.19.0'>about</a><a href='/vaadin-framework.git/?h=8.19.0'>summary</a><a href='/vaadin-framework.git/refs/?h=8.19.0'>refs</a><a href='/vaadin-framework.git/log/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>log</a><a class='active' href='/vaadin-framework.git/tree/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>tree</a><a href='/vaadin-framework.git/commit/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>commit</a><a href='/vaadin-framework.git/diff/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>diff</a><a href='/vaadin-framework.git/stats/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>stats</a></td><td class='form'><form class='right' method='get' action='/vaadin-framework.git/log/documentation/articles/EnablingServerPush.asciidoc'>
<input type='hidden' name='h' value='8.19.0'/><select name='qt'>
<option value='grep'>log msg</option>
<option value='author'>author</option>
<option value='committer'>committer</option>
<option value='range'>range</option>
</select>
<input class='txt' type='search' size='10' name='q' value=''/>
<input type='submit' value='search'/>
</form>
</td></tr></table>
<div class='path'>path: <a href='/vaadin-framework.git/tree/?h=8.19.0'>root</a>/<a href='/vaadin-framework.git/tree/documentation?h=8.19.0'>documentation</a>/<a href='/vaadin-framework.git/tree/documentation/articles?h=8.19.0'>articles</a>/<a href='/vaadin-framework.git/tree/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>EnablingServerPush.asciidoc</a></div><div class='content'>blob: 99bd7dc8441cca850f554538a8d145de1fd020ea (<a href='/vaadin-framework.git/plain/documentation/articles/EnablingServerPush.asciidoc?h=8.19.0'>plain</a>)
<table summary='blob content' class='blob'>
<tr><td class='linenumbers'><pre><a id='n1' href='#n1'>1</a>
<a id='n2' href='#n2'>2</a>
<a id='n3' href='#n3'>3</a>
<a id='n4' href='#n4'>4</a>
<a id='n5' href='#n5'>5</a>
<a id='n6' href='#n6'>6</a>
<a id='n7' href='#n7'>7</a>
<a id='n8' href='#n8'>8</a>
<a id='n9' href='#n9'>9</a>
<a id='n10' href='#n10'>10</a>
<a id='n11' href='#n11'>11</a>
<a id='n12' href='#n12'>12</a>
<a id='n13' href='#n13'>13</a>
<a id='n14' href='#n14'>14</a>
<a id='n15' href='#n15'>15</a>
<a id='n16' href='#n16'>16</a>
<a id='n17' href='#n17'>17</a>
<a id='n18' href='#n18'>18</a>
<a id='n19' href='#n19'>19</a>
<a id='n20' href='#n20'>20</a>
<a id='n21' href='#n21'>21</a>
<a id='n22' href='#n22'>22</a>
<a id='n23' href='#n23'>23</a>
<a id='n24' href='#n24'>24</a>
<a id='n25' href='#n25'>25</a>
<a id='n26' href='#n26'>26</a>
<a id='n27' href='#n27'>27</a>
<a id='n28' href='#n28'>28</a>
<a id='n29' href='#n29'>29</a>
<a id='n30' href='#n30'>30</a>
<a id='n31' href='#n31'>31</a>
<a id='n32' href='#n32'>32</a>
<a id='n33' href='#n33'>33</a>
<a id='n34' href='#n34'>34</a>
<a id='n35' href='#n35'>35</a>
<a id='n36' href='#n36'>36</a>
<a id='n37' href='#n37'>37</a>
<a id='n38' href='#n38'>38</a>
<a id='n39' href='#n39'>39</a>
<a id='n40' href='#n40'>40</a>
<a id='n41' href='#n41'>41</a>
<a id='n42' href='#n42'>42</a>
<a id='n43' href='#n43'>43</a>
<a id='n44' href='#n44'>44</a>
<a id='n45' href='#n45'>45</a>
<a id='n46' href='#n46'>46</a>
<a id='n47' href='#n47'>47</a>
<a id='n48' href='#n48'>48</a>
<a id='n49' href='#n49'>49</a>
<a id='n50' href='#n50'>50</a>
<a id='n51' href='#n51'>51</a>
<a id='n52' href='#n52'>52</a>
<a id='n53' href='#n53'>53</a>
<a id='n54' href='#n54'>54</a>
<a id='n55' href='#n55'>55</a>
<a id='n56' href='#n56'>56</a>
<a id='n57' href='#n57'>57</a>
<a id='n58' href='#n58'>58</a>
<a id='n59' href='#n59'>59</a>
<a id='n60' href='#n60'>60</a>
<a id='n61' href='#n61'>61</a>
<a id='n62' href='#n62'>62</a>
<a id='n63' href='#n63'>63</a>
<a id='n64' href='#n64'>64</a>
<a id='n65' href='#n65'>65</a>
<a id='n66' href='#n66'>66</a>
<a id='n67' href='#n67'>67</a>
<a id='n68' href='#n68'>68</a>
<a id='n69' href='#n69'>69</a>
<a id='n70' href='#n70'>70</a>
<a id='n71' href='#n71'>71</a>
<a id='n72' href='#n72'>72</a>
<a id='n73' href='#n73'>73</a>
<a id='n74' href='#n74'>74</a>
<a id='n75' href='#n75'>75</a>
<a id='n76' href='#n76'>76</a>
<a id='n77' href='#n77'>77</a>
<a id='n78' href='#n78'>78</a>
<a id='n79' href='#n79'>79</a>
<a id='n80' href='#n80'>80</a>
<a id='n81' href='#n81'>81</a>
<a id='n82' href='#n82'>82</a>
<a id='n83' href='#n83'>83</a>
<a id='n84' href='#n84'>84</a>
<a id='n85' href='#n85'>85</a>
<a id='n86' href='#n86'>86</a>
<a id='n87' href='#n87'>87</a>
<a id='n88' href='#n88'>88</a>
<a id='n89' href='#n89'>89</a>
<a id='n90' href='#n90'>90</a>
<a id='n91' href='#n91'>91</a>
<a id='n92' href='#n92'>92</a>
<a id='n93' href='#n93'>93</a>
<a id='n94' href='#n94'>94</a>
<a id='n95' href='#n95'>95</a>
<a id='n96' href='#n96'>96</a>
<a id='n97' href='#n97'>97</a>
<a id='n98' href='#n98'>98</a>
<a id='n99' href='#n99'>99</a>
<a id='n100' href='#n100'>100</a>
<a id='n101' href='#n101'>101</a>
<a id='n102' href='#n102'>102</a>
<a id='n103' href='#n103'>103</a>
<a id='n104' href='#n104'>104</a>
<a id='n105' href='#n105'>105</a>
<a id='n106' href='#n106'>106</a>
<a id='n107' href='#n107'>107</a>
<a id='n108' href='#n108'>108</a>
<a id='n109' href='#n109'>109</a>
<a id='n110' href='#n110'>110</a>
<a id='n111' href='#n111'>111</a>
<a id='n112' href='#n112'>112</a>
<a id='n113' href='#n113'>113</a>
<a id='n114' href='#n114'>114</a>
<a id='n115' href='#n115'>115</a>
<a id='n116' href='#n116'>116</a>
<a id='n117' href='#n117'>117</a>
<a id='n118' href='#n118'>118</a>
<a id='n119' href='#n119'>119</a>
<a id='n120' href='#n120'>120</a>
<a id='n121' href='#n121'>121</a>
<a id='n122' href='#n122'>122</a>
<a id='n123' href='#n123'>123</a>
<a id='n124' href='#n124'>124</a>
<a id='n125' href='#n125'>125</a>
<a id='n126' href='#n126'>126</a>
<a id='n127' href='#n127'>127</a>
<a id='n128' href='#n128'>128</a>
<a id='n129' href='#n129'>129</a>
<a id='n130' href='#n130'>130</a>
<a id='n131' href='#n131'>131</a>
<a id='n132' href='#n132'>132</a>
<a id='n133' href='#n133'>133</a>
<a id='n134' href='#n134'>134</a>
<a id='n135' href='#n135'>135</a>
<a id='n136' href='#n136'>136</a>
<a id='n137' href='#n137'>137</a>
<a id='n138' href='#n138'>138</a>
<a id='n139' href='#n139'>139</a>
<a id='n140' href='#n140'>140</a>
<a id='n141' href='#n141'>141</a>
</pre></td>
<td class='lines'><pre><code><style>pre { line-height: 125%; }
td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
.highlight .hll { background-color: #ffffcc }
.highlight .c { color: #888888 } /* Comment */
.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
.highlight .k { color: #008800; font-weight: bold } /* Keyword */
.highlight .ch { color: #888888 } /* Comment.Hashbang */
.highlight .cm { color: #888888 } /* Comment.Multiline */
.highlight .cp { color: #cc0000; font-weight: bold } /* Comment.Preproc */
.highlight .cpf { color: #888888 } /* Comment.PreprocFile */
.highlight .c1 { color: #888888 } /* Comment.Single */
.highlight .cs { color: #cc0000; font-weight: bold; background-color: #fff0f0 } /* Comment.Special */
.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .gr { color: #aa0000 } /* Generic.Error */
.highlight .gh { color: #333333 } /* Generic.Heading */
.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
.highlight .go { color: #888888 } /* Generic.Output */
.highlight .gp { color: #555555 } /* Generic.Prompt */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #666666 } /* Generic.Subheading */
.highlight .gt { color: #aa0000 } /* Generic.Traceback */
.highlight .kc { color: #008800; font-weight: bold } /* Keyword.Constant */
.highlight .kd { color: #008800; font-weight: bold } /* Keyword.Declaration */
.highlight .kn { color: #008800; font-weight: bold } /* Keyword.Namespace */
.highlight .kp { color: #008800 } /* Keyword.Pseudo */
.highlight .kr { color: #008800; font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: #888888; font-weight: bold } /* Keyword.Type */
.highlight .m { color: #0000DD; font-weight: bold } /* Literal.Number */
.highlight .s { color: #dd2200; background-color: #fff0f0 } /* Literal.String */
.highlight .na { color: #336699 } /* Name.Attribute */
.highlight .nb { color: #003388 } /* Name.Builtin */
.highlight .nc { color: #bb0066; font-weight: bold } /* Name.Class */
.highlight .no { color: #003366; font-weight: bold } /* Name.Constant */
.highlight .nd { color: #555555 } /* Name.Decorator */
.highlight .ne { color: #bb0066; font-weight: bold } /* Name.Exception */
.highlight .nf { color: #0066bb; font-weight: bold } /* Name.Function */
.highlight .nl { color: #336699; font-style: italic } /* Name.Label */
.highlight .nn { color: #bb0066; font-weight: bold } /* Name.Namespace */
.highlight .py { color: #336699; font-weight: bold } /* Name.Property */
.highlight .nt { color: #bb0066; font-weight: bold } /* Name.Tag */
.highlight .nv { color: #336699 } /* Name.Variable */
.highlight .ow { color: #008800 } /* Operator.Word */
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
.highlight .mb { color: #0000DD; font-weight: bold } /* Literal.Number.Bin */
.highlight .mf { color: #0000DD; font-weight: bold } /* Literal.Number.Float */
.highlight .mh { color: #0000DD; font-weight: bold } /* Literal.Number.Hex */
.highlight .mi { color: #0000DD; font-weight: bold } /* Literal.Number.Integer */
.highlight .mo { color: #0000DD; font-weight: bold } /* Literal.Number.Oct */
.highlight .sa { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Affix */
.highlight .sb { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Backtick */
.highlight .sc { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Char */
.highlight .dl { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Delimiter */
.highlight .sd { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Doc */
.highlight .s2 { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Double */
.highlight .se { color: #0044dd; background-color: #fff0f0 } /* Literal.String.Escape */
.highlight .sh { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Heredoc */
.highlight .si { color: #3333bb; background-color: #fff0f0 } /* Literal.String.Interpol */
.highlight .sx { color: #22bb22; background-color: #f0fff0 } /* Literal.String.Other */
.highlight .sr { color: #008800; background-color: #fff0ff } /* Literal.String.Regex */
.highlight .s1 { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Single */
.highlight .ss { color: #aa6600; background-color: #fff0f0 } /* Literal.String.Symbol */
.highlight .bp { color: #003388 } /* Name.Builtin.Pseudo */
.highlight .fm { color: #0066bb; font-weight: bold } /* Name.Function.Magic */
.highlight .vc { color: #336699 } /* Name.Variable.Class */
.highlight .vg { color: #dd7700 } /* Name.Variable.Global */
.highlight .vi { color: #3333bb } /* Name.Variable.Instance */
.highlight .vm { color: #336699 } /* Name.Variable.Magic */
.highlight .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */</style><div class="highlight"><pre><span></span>---
title: Enabling Server Push
order: 10
layout: page
---

[[enabling-server-push]]
= Enabling server push

The traditional way of communication between client and server in Vaadin
has been through XHR, i.e. AJAX requests. The client does a request to
the server with information about RPC method invocations, which are
executed on the server. As a result the state of one or several
components is updated and the changes are sent back as a response to the
client. Vaadin 7.1 introduces a new way of doing communications using
server push, which enables the server to push state changes to the
client without a request initiated by the client.

To create a push enabled application you start by creating a normal
Vaadin 7 project using Eclipse or Maven. First you need to add the
vaadin-push package to your project, so open pom.xml or ivy.xml and add
a vaadin-push dependency, e.g. in Ivy

[source,xml]
....
&lt;dependency org=&quot;com.vaadin&quot; name=&quot;vaadin-push&quot; rev=&quot;&amp;vaadin.version;&quot; conf=&quot;default-&gt;default&quot; /&gt;
....

and in Maven

[source,xml]
....
&lt;dependency&gt;
    &lt;groupId&gt;com.vaadin&lt;/groupId&gt;
    &lt;artifactId&gt;vaadin-push&lt;/artifactId&gt;
    &lt;version&gt;${vaadin.version}&lt;/version&gt;
&lt;/dependency&gt;
....

Open your UI class and add a @Push annotation to enable push for the ui

[source,java]
....
@Push
public class PushTestUI extends UI {
...
}
....

If you are using a servlet 3.0 compatible server, open *web.xml* and
enable asynchronous processing by adding a
`&lt;async-supported&gt;true&lt;/async-supported&gt;` tag.

Your servlet definition should look something like this:

[source,xml]
....
&lt;servlet&gt;
    &lt;servlet-name&gt;MyServlet&lt;/servlet-name&gt;
    &lt;servlet-class&gt;com.vaadin.server.VaadinServlet&lt;/servlet-class&gt;
    &lt;init-param&gt;
        &lt;param-name&gt;ui&lt;/param-name&gt;
        &lt;param-value&gt;org.vaadin.example.MyUI&lt;/param-value&gt;
    &lt;/init-param&gt;
    &lt;async-supported&gt;true&lt;/async-supported&gt;
&lt;/servlet&gt;
....

Your application is now setup for push and will automatically push
changes to the browser when needed. You can test it out using e.g. the
following UI which only adds a Label and starts a thread which does the
real initialization:

[source,java]
....
@Push
public class PushTestUI extends UI {

    private VerticalLayout mainLayout;

    @Override
    protected void init(VaadinRequest request) {
        mainLayout = new VerticalLayout();
        mainLayout.setSizeFull();
        mainLayout.setMargin(true);
        setContent(mainLayout);

        mainLayout.setDefaultComponentAlignment(Alignment.MIDDLE_CENTER);
        Label loadingText = new Label(&quot;Loading UI, please wait...&quot;);
        loadingText.setSizeUndefined();
        mainLayout.addComponent(loadingText);
        new InitializerThread().start();
    }

    class InitializerThread extends Thread {
        @Override
        public void run() {
            // Do initialization which takes some time.
            // Here represented by a 1s sleep
            try {
                Thread.sleep(1000);
            } catch (InterruptedException e) {
            }

            // Init done, update the UI after doing locking
            access(new Runnable() {
                @Override
                public void run() {
                    // Here the UI is locked and can be updated
                    mainLayout.removeAllComponents();
                    mainLayout
                            .addComponent(new TextArea(&quot;This is the real UI&quot;));
                }
            });
        }
    }
}
....

`InitializerThread` is a `Thread` which simulates some work using a
sleep and then updates the UI with the real content. The UI update takes
place inside an _access_ call, which ensures the UI (actually the
`VaadinSession`) is locked to prevent synchronizations problems.

Now deploy the application to your server and open the UI in a browser.
You will see the &quot;Loading...&quot; text for roughly a second and when
the initialization is complete, the Label will be replaced by a
`TextArea`.

The changes were automatically pushed to the browser when the
_access_-block was done running. If you want full control on when
changes are pushed to the client, add `@Push(PushMode.MANUAL)` instead and
call `UI.push()` to push the changes (`UI.push()` needs to be called when
the session is locked, so run that inside the _access_ block too).

You can also configure push mode for the whole application using the
`pushmode` servlet init parameter. Possible values are `automatic`, `manual`
and `disabled`.

It is also possible to switch the push mode on the fly using
`UI.getPushConfiguration().setPushMode()`.
</pre></div>
