I thought it would be a good idea if I document the problems as I run into them. Starting with a problem within the JSF 2 spec (http://java.net/jira/browse/JAVASERVERFACES_SPEC_PUBLIC-1024), you cannot have something like:

<h:form>
   <f:ajax .. render="some-panel-id"/>
<h:form>

<a4j:outputPanel id="some-panel-id">
   <ui:include src="#{a dynamically generated URI}" />
</a4j:outputPanel>

If the ui:include contains another h:form, it will not work on the first request. But it will work on the second one This is because the first render does not include the hidden javax.faces.ViewState input.

To resolve this issue, it was fairly simple. Take the code from above and note the changes:

<h:form>
   <f:ajax .. render="@form"/>

   <ui:include src="#{a dynamically generated URI}" />

<h:form>

So remove the outputPanel and allow the form from the include to be nested. This gives us a ViewState for the form(s) on first request.

Why would you want an ui:include within the same markup as your navigation? The main reason is because the "mobile web way" is to put all your content within one page. This allows you to use divs as mock pages and gives you the smooth sliding transitions without an HTTP request. With RichFaces 4, you can just render these regions on ajax requests - thus giving you an easy way to take an existing site to the mobile web.