patchFlags.ts 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. // Patch flags are optimization hints generated by the compiler.
  2. // when a block with dynamicChildren is encountered during diff, the algorithm
  3. // enters "optimized mode". In this mode, we know that the vdom is produced by
  4. // a render function generated by the compiler, so the algorithm only needs to
  5. // handle updates explicitly marked by these patch flags.
  6. // Patch flags can be combined using the | bitwise operator and can be checked
  7. // using the & operator, e.g.
  8. //
  9. // const flag = TEXT | CLASS
  10. // if (flag & TEXT) { ... }
  11. //
  12. // Check the `patchElement` function in './createRednerer.ts' to see how the
  13. // flags are handled during diff.
  14. // Indicates an element with dynamic textContent (children fast path)
  15. export const TEXT = 1
  16. // Indicates an element with dynamic class.
  17. // The compiler also pre-normalizes the :class binding:
  18. // - b -> normalize(b)
  19. // - ['foo', b] -> 'foo' + normalize(b)
  20. // - { a, b: c } -> (a ? a : '') + (b ? c : '')
  21. // - ['a', b, { c }] -> 'a' + normalize(b) + (c ? c : '')
  22. export const CLASS = 1 << 1
  23. // Indicates an element with dynamic style
  24. // The compiler pre-compiles static string styles into static objects
  25. // + detects and hoists inline static objects
  26. // e.g. style="color: red" and :style="{ color: 'red' }" both get hoisted as
  27. // const style = { color: 'red' }
  28. // render() { return e('div', { style }) }
  29. export const STYLE = 1 << 2
  30. // Indicates an element that has non-class/style dynamic props.
  31. // Can also be on a component that has any dynamic props (includes class/style).
  32. // when this flag is present, the vnode also has a dynamicProps array that
  33. // contains the keys of the props that may change so the runtime can diff
  34. // them faster (without having to worry about removed props)
  35. export const PROPS = 1 << 3
  36. // Indicates an element with props with dynamic keys. When keys change, a full
  37. // diff is always needed to remove the old key. This flag is mutually exclusive
  38. // with CLASS, STYLE and PROPS.
  39. export const FULL_PROPS = 1 << 4
  40. // Indicates a fragment or element with keyed or partially-keyed v-for children
  41. export const KEYED = 1 << 5
  42. // Indicates a fragment or element that contains unkeyed v-for children
  43. export const UNKEYED = 1 << 6
  44. // Indicates a component with dynamic slots (e.g. slot that references a v-for
  45. // iterated value, or dynamic slot names).
  46. // Components with this flag are always force updated.
  47. export const DYNAMIC_SLOTS = 1 << 7
  48. // Indicates an element with ref. This includes static string refs because the
  49. // refs object is refreshed on each update and all refs need to set again.
  50. export const REF = 1 << 8