renderElement() — vue Function Reference

Architecture documentation for the renderElement() function in render.ts from the vue codebase.

Function typescript ServerRenderer BundleRenderer calls 4 called by 1

Entity Profile

ServerRenderer→ BundleRenderer→ renderElement() — vue Function Reference

Dependency Diagram

graph TD
  ea57a750_853d_071e_282c_4b7157987b46["renderElement()"]
  41d8a2ed_7600_023d_56ff_e6bd2066a1b0["renderNode()"]
  41d8a2ed_7600_023d_56ff_e6bd2066a1b0 -->|calls| ea57a750_853d_071e_282c_4b7157987b46
  7b3aa424_9089_4803_a4c7_86c4f80ba973["isTrue()"]
  ea57a750_853d_071e_282c_4b7157987b46 -->|calls| 7b3aa424_9089_4803_a4c7_86c4f80ba973
  53f01abe_8351_b7b9_b0eb_09fd4e96879f["registerComponentForCache()"]
  ea57a750_853d_071e_282c_4b7157987b46 -->|calls| 53f01abe_8351_b7b9_b0eb_09fd4e96879f
  4c03e6b5_515a_506e_9433_bf75e6caf6a5["renderStartingTag()"]
  ea57a750_853d_071e_282c_4b7157987b46 -->|calls| 4c03e6b5_515a_506e_9433_bf75e6caf6a5
  a1f5b8ca_b6d5_6b24_155e_038685c97c85["isUndef()"]
  ea57a750_853d_071e_282c_4b7157987b46 -->|calls| a1f5b8ca_b6d5_6b24_155e_038685c97c85
  style ea57a750_853d_071e_282c_4b7157987b46 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/server-renderer/src/render.ts lines 304–334

function renderElement(el, isRoot, context) {
  const { write, next } = context

  if (isTrue(isRoot)) {
    if (!el.data) el.data = {}
    if (!el.data.attrs) el.data.attrs = {}
    el.data.attrs[SSR_ATTR] = 'true'
  }

  if (el.fnOptions) {
    registerComponentForCache(el.fnOptions, write)
  }

  const startTag = renderStartingTag(el, context)
  const endTag = `</${el.tag}>`
  if (context.isUnaryTag(el.tag)) {
    write(startTag, next)
  } else if (isUndef(el.children) || el.children.length === 0) {
    write(startTag + endTag, next)
  } else {
    const children: Array<VNode> = el.children
    context.renderStates.push({
      type: 'Element',
      children,
      rendered: 0,
      total: children.length,
      endTag
    })
    write(startTag, next)
  }
}