title: Separate the `renderUI` in a module server
body: <p>In some complex and large shiny apps, the UI parts are often rendered with <code>renderUI</code> and <code>uiOutput</code>. Consider this small app for illustration:</p>
  <pre class="lang-r prettyprint-override"><code>library(shiny)
  
  modUI &lt;- function(id) {
    ns &lt;- NS(id)
    uiOutput(ns(&quot;theUI&quot;))
  }
  
  modServer &lt;- function(id) {
    moduleServer(
      id, 
      function(input, output, session) {
        
        output[[&quot;plot&quot;]] &lt;- renderPlot({
          n &lt;- input[[&quot;numb&quot;]]
          plot(rnorm(n), rnorm(n), pch = 19L)
        })
        
        ns &lt;- session$ns
        output[[&quot;theUI&quot;]] &lt;- renderUI({
          tagList(
            sliderInput(ns(&quot;numb&quot;), &quot;N&quot;, 10, 100, 50),
            plotOutput(ns(&quot;plot&quot;))
          )
        })
      }
    )
  }
  
  ui &lt;- basicPage(
    br(),
    modUI(&quot;myapp&quot;)
  )
  
  server &lt;- function(input, output, session) {
    modServer(&quot;myapp&quot;)
  }
  
  shinyApp(ui, server)
  </code></pre>
  <p>Here <code>modUI</code> is ridiculously small. But in <code>modServer</code>, the <code>renderUI</code> could be large and there could be many other <code>output</code> components. Therefore it is desirable to split <code>modServer</code>:</p>
  <pre class="lang-r prettyprint-override"><code>renderPlotServer &lt;- function(id) {
    moduleServer(
      id, 
      function(input, output, session) {
        
        output[[&quot;plot&quot;]] &lt;- renderPlot({
          n &lt;- input[[&quot;numb&quot;]]
          plot(rnorm(n), rnorm(n), pch = 19L)
        })
        
      }
    )
  }
  
  renderUIServer &lt;- function(id) {
    moduleServer(
      id, 
      function(input, output, session) {
        
        ns &lt;- session$ns
        output[[&quot;theUI&quot;]] &lt;- renderUI({
          tagList(
            sliderInput(ns(&quot;numb&quot;), &quot;N&quot;, 10, 100, 50),
            plotOutput(ns(&quot;plot&quot;))
          )
        })
        
      }
    )
  }
  </code></pre>
  <p>and to put them together one can use the same <code>id</code>:</p>
  <pre class="lang-r prettyprint-override"><code>modServer &lt;- function(id) {
    moduleServer(
      id, 
      function(input, output, session) {
        renderPlotServer(&quot;mysubapp&quot;)
        renderUIServer(&quot;mysubapp&quot;)
      }
    )
  }
  </code></pre>
  <p>but then we need a <em>nested namespace</em> in the UI part of the module:</p>
  <pre class="lang-r prettyprint-override"><code>modUI &lt;- function(id) {
    ns &lt;- NS(NS(id)(&quot;mysubapp&quot;))
    uiOutput(ns(&quot;theUI&quot;))
  }
  </code></pre>
  <p>This is not convenient.</p>
  <p>A more convenient solution consists in using a <code>NULL</code> namespace, to avoid the nested namespace in the UI part:</p>
  <pre class="lang-r prettyprint-override"><code>modServer &lt;- function(id) {
    moduleServer(
      id, 
      function(input, output, session) {
        renderPlotServer(NULL)
        renderUIServer(NULL)
      }
    )
  }
  </code></pre>
  <p>But this solution has a problem: it prevent to use the module multiple times.</p>
  <p>So, what would be a convenient solution avoiding this problem?</p>
  <p>I think I have one: one can nest the &quot;main&quot; id with itself:</p>
  <pre class="lang-r prettyprint-override"><code>modServer &lt;- function(id) {
    moduleServer(
      id, 
      function(input, output, session) {
        renderPlotServer(id)
        renderUIServer(id)
      }
    )
  }
  
  modUI &lt;- function(id) {
    ns &lt;- NS(NS(id)(id))
    uiOutput(ns(&quot;theUI&quot;))
  }
  </code></pre>
  <p>Do you have another nice solution?</p>