chore: notes on style binding optimization

diff --git a/packages/runtime-core/src/createRenderer.ts b/packages/runtime-core/src/createRenderer.ts
index 8c5860e67b6874b909269ea68f5ca054333f1371..1a27b11316fb36bc79c8a1a5302e422671d1782c 100644 (file)
--- a/packages/runtime-core/src/createRenderer.ts
+++ b/packages/runtime-core/src/createRenderer.ts
@@ -318,7 +318,6 @@ export function createRenderer(options: RendererOptions) {
 
         // style
         // this flag is matched when the element has dynamic style bindings
-        // TODO separate static and dynamic styles?
         if (patchFlag & STYLE) {
           hostPatchProp(el, 'style', newProps.style, oldProps.style, isSVG)
         }

diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index ce76e3fe89471d71f66602a8b31982eedb61f562..46d547da01d298b16af5bb803b132f67cab84215 100644 (file)
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -9,6 +9,7 @@ export {
   Portal
 } from './vnode'
 
+export { nextTick } from './scheduler'
 export { createComponent, FunctionalComponent } from './component'
 export { createRenderer, RendererOptions } from './createRenderer'
 export { Slot, Slots } from './componentSlots'

diff --git a/packages/runtime-core/src/patchFlags.ts b/packages/runtime-core/src/patchFlags.ts
index ff7a4ce52059015ca73b163273365bb9734fd237..119111f1c9d852b7890fd3be768bb8671f8fd634 100644 (file)
--- a/packages/runtime-core/src/patchFlags.ts
+++ b/packages/runtime-core/src/patchFlags.ts
@@ -25,6 +25,11 @@ export const TEXT = 1
 export const CLASS = 1 << 1
 
 // Indicates an element with dynamic style
+// The compiler pre-compiles static string styles into static objects
+// + detects and hoists inline static objects
+// e.g. style="color: red" and :style="{ color: 'red' }" both get hoisted as
+//   const style = { color: 'red' }
+//   render() { return e('div', { style }) }
 export const STYLE = 1 << 2
 
 // Indicates an element that has non-class/style dynamic props.