[TOC] * * * * * # 1 InfernoDOM模块包 ## .1 包目录 ~~~ packages/inferno-dom/ src/ ;InfernoDOM模块对应源代码入口 inferno-dom.js ;InfernoDOM模块打包入口 ~~~ ## .2 包入口 ~~~ packages/inferno-dom/src/index.js ;导入Inferno源代码入口 import { render } from '../../../src/DOM/rendering'; ;导出接口 export default { render }; ~~~ # 2 InfernoDOM模块源代码 ## .1 源代码的目录 ~~~ src\DOM\ __tests__ ;模块测试目录 diffing.js lifecycle.js mounting.js patching.js recycling.js rendering.js utils.js ~~~ ## .2 源代码文件 ### 1 rendering.js ~~~ ;按照依赖关系顺序 src\DOM\rendering.js ;导入文件 ;lifecycle.js,mounting.js,patching.js,utils.js import Lifecycle from './lifecycle'; import { mount } from './mounting'; import { patch } from './patching'; import { getActiveNode, resetActiveNode } from './utils'; ;导出render()接口 export function render(node, parentDom) ~~~ ### 2 lifecycle.js ~~~ ;导入patching.js文件 import { patchNode } from './patching'; ;导出接口 ;Lifecycle(),handleLazyAttached(),setClipNode() export default function Lifecycle() export function handleLazyAttached(node, lifecycle, dom) export function setClipNode(clipData, dom, lastNode, nextNode, parentDom, lifecycle) ~~~ ### 3 mounting.js ~~~ ;导入文件 ;core/utils.js,recycling.js,utils.js,patching.js,lifecycle.js import { isArray, isStringOrNumber, isFunction, isNullOrUndefined, addChildrenToProps, isStatefulComponent, isString, isInvalidNode, isPromise, replaceInArray, getRefInstance } from './../core/utils'; import { recyclingEnabled, recycle } from './recycling'; import { appendText, documentCreateElement, createVirtualFragment, insertOrAppendNonKeyed, createEmptyTextNode, selectValue, placeholder, handleAttachedHooks, createNullNode } from './utils'; import { patchAttribute, patchStyle, patch } from './patching'; import { handleLazyAttached } from './lifecycle'; ;导出接口 ;mount(), ;mountArrayChildrenWithKeys() mountArrayChildren(), ;mountEvents(),mountComponent() export function mount(input, parentDom, lifecycle, context, instance, isSVG) export function mountArrayChildrenWithKeys(children, parentDom, lifecycle, context, instance) export function mountArrayChildren(node, children, parentDom, lifecycle, context, instance, isSVG) export function mountEvents(events, eventKeys, dom) export function mountComponent(parentNode, Component, props, hooks, children, lastInstance, parentDom, lifecycle, context) ~~~ ### 4 patching.js ~~~ ;导入文件 ;core/utils.js,diffing.js,mounting.js,utils.js import { isNullOrUndefined, isString, addChildrenToProps, isStatefulComponent, isStringOrNumber, isArray, isInvalidNode } from './../core/utils'; import { diffNodes, diffNodesWithTemplate } from './diffing'; import { mount } from './mounting'; import { insertOrAppendKeyed, insertOrAppendNonKeyed, remove, detachNode, createVirtualFragment, isKeyed, replaceNode } from './utils'; ;导出接口 ;updateTextNode(),patchNode(),patch(),patchStyle(),patchEvents(),patchAttribute() ;patchComponent(),patchNonKeyedChildren(),patchKeyedChildren() export function updateTextNode(dom, lastChildren, nextChildren) export function patchNode(lastNode, nextNode, parentDom, lifecycle, context, instance, isSVG, skipLazyCheck) export function patch(lastInput, nextInput, parentDom, lifecycle, context, instance, isNode, isSVG) export function patchStyle(lastAttrValue, nextAttrValue, dom) export function patchEvents(lastEvents, nextEvents, _lastEventKeys, _nextEventKeys, dom) export function patchAttribute(attrName, lastAttrValue, nextAttrValue, dom) export function patchComponent(hasTemplate, lastNode, Component, lastBp, nextBp, instance, lastProps, nextProps, nextHooks, nextChildren, parentDom, lifecycle, context) export function patchNonKeyedChildren(lastChildren, nextChildren, dom, domChildren, lifecycle, context, instance, domChildrenIndex, isSVG) export function patchKeyedChildren(lastChildren, nextChildren, dom, lifecycle, context, instance, isSVG) ~~~ ### 5 diffing.js ~~~ ;导入文件 ;core/utils.js,utils.js,patching.js,mounting.js,lifecycle.js import { isArray, isStringOrNumber, isFunction, isNullOrUndefined, isStatefulComponent, isInvalidNode, isString, isPromise, getRefInstance } from './../core/utils'; import { replaceWithNewNode, isKeyed, selectValue, removeEvents, removeAllChildren, remove, detachNode, replaceNode } from './utils'; import { patchNonKeyedChildren, patchKeyedChildren, patchAttribute, patchComponent, patchStyle, updateTextNode, patch, patchEvents } from './patching'; import { mountArrayChildren, mount, mountEvents, mountComponent } from './mounting'; import { setClipNode } from './lifecycle'; ;导出接口 ;diffEvents(),diffNodesWithTemplate(),diffNodes() export function diffEvents(lastNode, nextNode, lastEventKeys, nextEventKeys, dom) export function diffNodesWithTemplate(lastNode, nextNode, lastBp, nextBp, parentDom, lifecycle, context, instance, skipLazyCheck) export function diffNodes(lastNode, nextNode, parentDom, lifecycle, context, instance, isSVG) ~~~ ### 6 recycling.js ~~~ ;导入文件 ;patching.js,core/utils.js import { patch } from './patching'; import { isNullOrUndefined } from './../core/utils'; ;导出接口 recyclingEnabled,recycl(),pool() export const recyclingEnabled = true; export function recycle(node, bp, lifecycle, context, instance) export function pool(node) ~~~ # 3 InfernoDOM模块接口 ~~~ ~~~