optimize: clean view's props after being bunched fetched from native

doric-js/bundle/doric-lib.es5.js

@@ -2437,6 +2437,32 @@ function image(config) {
     return ret;
 }
 
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        var arguments$1 = arguments;
+
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments$1[i];
+            for (var p in s) { if (Object.prototype.hasOwnProperty.call(s, p))
+                { t[p] = s[p]; } }
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+function deepClone(nativeViewModel) {
+    var ret = {
+        id: nativeViewModel.id,
+        type: nativeViewModel.type,
+        props: __assign({}, nativeViewModel.props),
+    };
+    if (nativeViewModel.props.subviews) {
+        ret.props.subviews = nativeViewModel.props.subviews
+            .map(function (e) { return deepClone(e); });
+    }
+    return ret;
+}
+
 /*
  * Copyright [2019] [Doric.Pub]
  *
@@ -2570,10 +2596,11 @@ var List = /** @class */ (function (_super) {
     };
     List.prototype.renderBunchedItems = function (start, length) {
         var _this = this;
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map(function (_, idx) {
+        var items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            var listItem = _this.getItem(start + idx);
+            .fill(0).map(function (_, idx) { return _this.getItem(start + idx); });
-            return listItem.toModel();
+        var ret = items.map(function (e) { return deepClone(e.toModel()); });
-        });
+        items.forEach(function (e) { return e.clean(); });
+        return ret;
     };
     List.prototype.toModel = function () {
         if (this.loadMoreView) {
@@ -2744,10 +2771,11 @@ var Slider = /** @class */ (function (_super) {
     };
     Slider.prototype.renderBunchedItems = function (start, length) {
         var _this = this;
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map(function (_, idx) {
+        var items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            var slideItem = _this.getItem(start + idx);
+            .fill(0).map(function (_, idx) { return _this.getItem(start + idx); });
-            return slideItem.toModel();
+        var ret = items.map(function (e) { return deepClone(e.toModel()); });
-        });
+        items.forEach(function (e) { return e.clean(); });
+        return ret;
     };
     Slider.prototype.slidePage = function (context, page, smooth) {
         if (smooth === void 0) { smooth = false; }
@@ -3264,10 +3292,11 @@ var FlowLayout = /** @class */ (function (_super) {
     };
     FlowLayout.prototype.renderBunchedItems = function (start, length) {
         var _this = this;
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map(function (_, idx) {
+        var items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            var listItem = _this.getItem(start + idx);
+            .fill(0).map(function (_, idx) { return _this.getItem(start + idx); });
-            return listItem.toModel();
+        var ret = items.map(function (e) { return deepClone(e.toModel()); });
-        });
+        items.forEach(function (e) { return e.clean(); });
+        return ret;
     };
     FlowLayout.prototype.toModel = function () {
         if (this.loadMoreView) {
@@ -4030,10 +4059,11 @@ var HorizontalList = /** @class */ (function (_super) {
     };
     HorizontalList.prototype.renderBunchedItems = function (start, length) {
         var _this = this;
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map(function (_, idx) {
+        var items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            var listItem = _this.getItem(start + idx);
+            .fill(0).map(function (_, idx) { return _this.getItem(start + idx); });
-            return listItem.toModel();
+        var ret = items.map(function (e) { return deepClone(e.toModel()); });
-        });
+        items.forEach(function (e) { return e.clean(); });
+        return ret;
     };
     HorizontalList.prototype.toModel = function () {
         if (this.loadMoreView) {

doric-js/bundle/doric-lib.js

@@ -1849,6 +1849,19 @@ function image(config) {
     return ret;
 }
 
+function deepClone(nativeViewModel) {
+    const ret = {
+        id: nativeViewModel.id,
+        type: nativeViewModel.type,
+        props: Object.assign({}, nativeViewModel.props),
+    };
+    if (nativeViewModel.props.subviews) {
+        ret.props.subviews = nativeViewModel.props.subviews
+            .map(e => deepClone(e));
+    }
+    return ret;
+}
+
 /*
  * Copyright [2019] [Doric.Pub]
  *
@@ -1934,10 +1947,11 @@ class List extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {
@@ -2084,10 +2098,11 @@ class Slider extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const slideItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return slideItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     slidePage(context, page, smooth = false) {
         return this.nativeChannel(context, "slidePage")({ page, smooth });
@@ -2479,10 +2494,11 @@ class FlowLayout extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {
@@ -3069,10 +3085,11 @@ class HorizontalList extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {

doric-js/bundle/doric-sandbox.es5.js

@@ -293,10 +293,10 @@ var doric = (function (exports) {
 	(module.exports = function (key, value) {
 	  return sharedStore[key] || (sharedStore[key] = value !== undefined ? value : {});
 	})('versions', []).push({
-	  version: '3.28.0',
+	  version: '3.29.0',
 	  mode: 'global',
 	  copyright: '© 2014-2023 Denis Pushkarev (zloirock.ru)',
-	  license: 'https://github.com/zloirock/core-js/blob/v3.28.0/LICENSE',
+	  license: 'https://github.com/zloirock/core-js/blob/v3.29.0/LICENSE',
 	  source: 'https://github.com/zloirock/core-js'
 	});
 	});
@@ -9562,7 +9562,7 @@ var doric = (function (exports) {
 	var aTypedArray$d = arrayBufferViewCore.aTypedArray;
 	var exportTypedArrayMethod$e = arrayBufferViewCore.exportTypedArrayMethod;
 
-	var WORKS_WITH_OBJECTS_AND_GEERIC_ON_TYPED_ARRAYS = !fails(function () {
+	var WORKS_WITH_OBJECTS_AND_GENERIC_ON_TYPED_ARRAYS = !fails(function () {
 	  // eslint-disable-next-line es/no-typed-arrays -- required for testing
 	  var array = new Uint8ClampedArray(2);
 	  functionCall($set, array, { length: 1, 0: 3 }, 1);
@@ -9570,7 +9570,7 @@ var doric = (function (exports) {
 	});
 
 	// https://bugs.chromium.org/p/v8/issues/detail?id=11294 and other
-	var TO_OBJECT_BUG = WORKS_WITH_OBJECTS_AND_GEERIC_ON_TYPED_ARRAYS && arrayBufferViewCore.NATIVE_ARRAY_BUFFER_VIEWS && fails(function () {
+	var TO_OBJECT_BUG = WORKS_WITH_OBJECTS_AND_GENERIC_ON_TYPED_ARRAYS && arrayBufferViewCore.NATIVE_ARRAY_BUFFER_VIEWS && fails(function () {
 	  var array = new Int8Array$2(2);
 	  array.set(1);
 	  array.set('2', 1);
@@ -9583,13 +9583,13 @@ var doric = (function (exports) {
 	  aTypedArray$d(this);
 	  var offset = toOffset(arguments.length > 1 ? arguments[1] : undefined, 1);
 	  var src = toObject(arrayLike);
-	  if (WORKS_WITH_OBJECTS_AND_GEERIC_ON_TYPED_ARRAYS) { return functionCall($set, this, src, offset); }
+	  if (WORKS_WITH_OBJECTS_AND_GENERIC_ON_TYPED_ARRAYS) { return functionCall($set, this, src, offset); }
 	  var length = this.length;
 	  var len = lengthOfArrayLike(src);
 	  var index = 0;
 	  if (len + offset > length) { throw RangeError$2('Wrong length'); }
 	  while (index < len) { this[offset + index] = src[index++]; }
-	}, !WORKS_WITH_OBJECTS_AND_GEERIC_ON_TYPED_ARRAYS || TO_OBJECT_BUG);
+	}, !WORKS_WITH_OBJECTS_AND_GENERIC_ON_TYPED_ARRAYS || TO_OBJECT_BUG);
 
 	var aTypedArray$c = arrayBufferViewCore.aTypedArray;
 	var exportTypedArrayMethod$d = arrayBufferViewCore.exportTypedArrayMethod;
@@ -10566,14 +10566,14 @@ var doric = (function (exports) {
 
 	var Map$a = mapHelpers.Map;
 	var MapPrototype = mapHelpers.proto;
-	var forEach$1 = functionUncurryThis(MapPrototype.forEach);
+	var forEach$2 = functionUncurryThis(MapPrototype.forEach);
 	var entries = functionUncurryThis(MapPrototype.entries);
 	var next$1 = entries(new Map$a()).next;
 
 	var mapIterate = function (map, fn, interruptible) {
 	  return interruptible ? iterateSimple(entries(map), function (entry) {
 	    return fn(entry[1], entry[0]);
-	  }, next$1) : forEach$1(map, fn);
+	  }, next$1) : forEach$2(map, fn);
 	};
 
 	var Map$9 = mapHelpers.Map;
@@ -11447,7 +11447,7 @@ var doric = (function (exports) {
 	var $TypeError$d = TypeError;
 
 	var $RangeIterator = iteratorCreateConstructor(function NumericRangeIterator(start, end, option, type, zero, one) {
-	  // TODO: Drop the first `typeof` check after removing lagacy methods in `core-js@4`
+	  // TODO: Drop the first `typeof` check after removing legacy methods in `core-js@4`
 	  if (typeof start != type || (end !== Infinity && end !== -Infinity && typeof end != type)) {
 	    throw $TypeError$d(INCORRECT_RANGE);
 	  }
@@ -12363,31 +12363,21 @@ var doric = (function (exports) {
 	    var i = this.skip(IS_WHITESPACE$1, this.index);
 	    var fork = this.fork(i);
 	    var chr = at$1(source, i);
-	    var result;
+	    if (exec$6(IS_NUMBER_START, chr)) { return fork.number(); }
-	    if (exec$6(IS_NUMBER_START, chr)) { result = fork.number(); }
+	    switch (chr) {
-	    else { switch (chr) {
 	      case '{':
-	        result = fork.object();
+	        return fork.object();
-	        break;
 	      case '[':
-	        result = fork.array();
+	        return fork.array();
-	        break;
 	      case '"':
-	        result = fork.string();
+	        return fork.string();
-	        break;
 	      case 't':
-	        result = fork.keyword(true);
+	        return fork.keyword(true);
-	        break;
 	      case 'f':
-	        result = fork.keyword(false);
+	        return fork.keyword(false);
-	        break;
 	      case 'n':
-	        result = fork.keyword(null);
+	        return fork.keyword(null);
-	        break;
+	    } throw SyntaxError$2('Unexpected character: "' + chr + '" at: ' + i);
-	      default:
-	        throw SyntaxError$2('Unexpected character: "' + chr + '" at: ' + i);
-	    } }
-	    return result;
 	  },
 	  node: function (type, value, start, end, nodes) {
 	    return new Node(value, end, type ? null : slice$1(this.source, start, end), nodes);
@@ -13804,12 +13794,12 @@ var doric = (function (exports) {
 
 	var Set$7 = setHelpers.Set;
 	var SetPrototype = setHelpers.proto;
-	var forEach = functionUncurryThis(SetPrototype.forEach);
+	var forEach$1 = functionUncurryThis(SetPrototype.forEach);
 	var keys = functionUncurryThis(SetPrototype.keys);
 	var next = keys(new Set$7()).next;
 
 	var setIterate = function (set, fn, interruptible) {
-	  return interruptible ? iterateSimple(keys(set), fn, next) : forEach(set, fn);
+	  return interruptible ? iterateSimple(keys(set), fn, next) : forEach$1(set, fn);
 	};
 
 	var Set$6 = setHelpers.Set;
@@ -15714,7 +15704,7 @@ var doric = (function (exports) {
 
 	  var type = classof(value);
 	  var deep = false;
-	  var C, name, cloned, dataTransfer, i, length, keys, key, source, target;
+	  var C, name, cloned, dataTransfer, i, length, keys, key, source, target, options;
 
 	  switch (type) {
 	    case 'Array':
@@ -15869,11 +15859,12 @@ var doric = (function (exports) {
 	          if (!C && typeof value.slice != 'function') { throwUnpolyfillable(type); }
 	          // detached buffers throws in `DataView` and `.slice`
 	          try {
-	            if (typeof value.slice == 'function') {
+	            if (typeof value.slice == 'function' && !value.resizable) {
 	              cloned = value.slice(0);
 	            } else {
 	              length = value.byteLength;
-	              cloned = new ArrayBuffer(length);
+	              options = 'maxByteLength' in value ? { maxByteLength: value.maxByteLength } : undefined;
+	              cloned = new ArrayBuffer(length, options);
 	              source = new C(value);
 	              target = new C(cloned);
 	              for (i = 0; i < length; i++) {
@@ -16096,6 +16087,7 @@ var doric = (function (exports) {
 	    result += key + value;
 	  });
 	  return (isPure && !url.toJSON)
+	    || (!searchParams.size && (isPure || !descriptors))
 	    || !searchParams.sort
 	    || url.href !== 'http://a/c%20d?a=1&c=3'
 	    || searchParams.get('c') !== '3'
@@ -16322,6 +16314,7 @@ var doric = (function (exports) {
 
 
 
+
 
 
 	var ITERATOR = wellKnownSymbol('iterator');
@@ -16497,20 +16490,22 @@ var doric = (function (exports) {
 	// `URLSearchParams` constructor
 	// https://url.spec.whatwg.org/#interface-urlsearchparams
 	var URLSearchParamsConstructor = function URLSearchParams(/* init */) {
-	  anInstance(this, URLSearchParamsPrototype);
+	  anInstance(this, URLSearchParamsPrototype$1);
 	  var init = arguments.length > 0 ? arguments[0] : undefined;
-	  setInternalState$1(this, new URLSearchParamsState(init));
+	  var state = setInternalState$1(this, new URLSearchParamsState(init));
+	  if (!descriptors) { this.length = state.entries.length; }
 	};
 
-	var URLSearchParamsPrototype = URLSearchParamsConstructor.prototype;
+	var URLSearchParamsPrototype$1 = URLSearchParamsConstructor.prototype;
 
-	defineBuiltIns(URLSearchParamsPrototype, {
+	defineBuiltIns(URLSearchParamsPrototype$1, {
 	  // `URLSearchParams.prototype.append` method
 	  // https://url.spec.whatwg.org/#dom-urlsearchparams-append
 	  append: function append(name, value) {
 	    validateArgumentsLength(arguments.length, 2);
 	    var state = getInternalParamsState(this);
 	    push$1(state.entries, { key: toString_1(name), value: toString_1(value) });
+	    if (!descriptors) { this.length++; }
 	    state.updateURL();
 	  },
 	  // `URLSearchParams.prototype.delete` method
@@ -16525,6 +16520,7 @@ var doric = (function (exports) {
 	      if (entries[index].key === key) { splice(entries, index, 1); }
 	      else { index++; }
 	    }
+	    if (!descriptors) { this.length = entries.length; }
 	    state.updateURL();
 	  },
 	  // `URLSearchParams.prototype.get` method
@@ -16586,6 +16582,7 @@ var doric = (function (exports) {
 	      }
 	    }
 	    if (!found) { push$1(entries, { key: key, value: val }); }
+	    if (!descriptors) { this.length = entries.length; }
 	    state.updateURL();
 	  },
 	  // `URLSearchParams.prototype.sort` method
@@ -16623,14 +16620,24 @@ var doric = (function (exports) {
 	}, { enumerable: true });
 
 	// `URLSearchParams.prototype[@@iterator]` method
-	defineBuiltIn(URLSearchParamsPrototype, ITERATOR, URLSearchParamsPrototype.entries, { name: 'entries' });
+	defineBuiltIn(URLSearchParamsPrototype$1, ITERATOR, URLSearchParamsPrototype$1.entries, { name: 'entries' });
 
 	// `URLSearchParams.prototype.toString` method
 	// https://url.spec.whatwg.org/#urlsearchparams-stringification-behavior
-	defineBuiltIn(URLSearchParamsPrototype, 'toString', function toString() {
+	defineBuiltIn(URLSearchParamsPrototype$1, 'toString', function toString() {
 	  return getInternalParamsState(this).serialize();
 	}, { enumerable: true });
 
+	// `URLSearchParams.prototype.size` getter
+	// https://github.com/whatwg/url/pull/734
+	if (descriptors) { defineBuiltInAccessor(URLSearchParamsPrototype$1, 'size', {
+	  get: function size() {
+	    return getInternalParamsState(this).entries.length;
+	  },
+	  configurable: true,
+	  enumerable: true
+	}); }
+
 	setToStringTag(URLSearchParamsConstructor, URL_SEARCH_PARAMS);
 
 	_export({ global: true, constructor: true, forced: !urlConstructorDetection }, {
@@ -17739,6 +17746,23 @@ var doric = (function (exports) {
 	  }
 	});
 
+	var URLSearchParamsPrototype = URLSearchParams.prototype;
+	var forEach = functionUncurryThis(URLSearchParamsPrototype.forEach);
+
+	// `URLSearchParams.prototype.size` getter
+	// https://github.com/whatwg/url/pull/734
+	if (descriptors && !('size' in URLSearchParamsPrototype)) {
+	  defineBuiltInAccessor(URLSearchParamsPrototype, 'size', {
+	    get: function size() {
+	      var count = 0;
+	      forEach(this, function () { count++; });
+	      return count;
+	    },
+	    configurable: true,
+	    enumerable: true
+	  });
+	}
+
 	/*
 	 * Copyright [2019] [Doric.Pub]
 	 *

doric-js/bundle/doric-vm.js

@@ -3389,6 +3389,19 @@ function image(config) {
     return ret;
 }
 
+function deepClone(nativeViewModel) {
+    const ret = {
+        id: nativeViewModel.id,
+        type: nativeViewModel.type,
+        props: Object.assign({}, nativeViewModel.props),
+    };
+    if (nativeViewModel.props.subviews) {
+        ret.props.subviews = nativeViewModel.props.subviews
+            .map(e => deepClone(e));
+    }
+    return ret;
+}
+
 /*
  * Copyright [2019] [Doric.Pub]
  *
@@ -3474,10 +3487,11 @@ class List extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {
@@ -3624,10 +3638,11 @@ class Slider extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const slideItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return slideItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     slidePage(context, page, smooth = false) {
         return this.nativeChannel(context, "slidePage")({ page, smooth });
@@ -4019,10 +4034,11 @@ class FlowLayout extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {
@@ -4609,10 +4625,11 @@ class HorizontalList extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {

doric-js/index.d.ts

@@ -1627,6 +1627,10 @@ declare module "doric" {
 		duration: number;
 	}) => Promise<unknown>;
 	export function notification(context: BridgeContext): {
+		/**
+		 * @param androidSystem: when set true, using global broadcast instead of local broadcast by default
+		 * @param iosUsingObject: when set true, using object instead of userInfo by default
+		 */
 		publish: (args: {
 			biz?: string;
 			name: string;
@@ -1635,6 +1639,10 @@ declare module "doric" {
 			iosUsingObject?: boolean;
 			permission?: string;
 		}) => Promise<any>;
+		/**
+		 * @param androidSystem: when set true, using global broadcast instead of local broadcast by default
+		 * @param iosUsingObject: when set true, using object instead of userInfo by default
+		 */
 		subscribe: (args: {
 			biz?: string | undefined;
 			name: string;

doric-js/lib/src/widget/flowlayout.js

@@ -25,6 +25,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 import { Stack } from './layouts';
 import { Property, Superview, View } from '../ui/view';
 import { layoutConfig } from '../util/index.util';
+import { deepClone } from './utils';
 export class FlowLayoutItem extends Stack {
 }
 __decorate([
@@ -83,10 +84,11 @@ export class FlowLayout extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {

doric-js/lib/src/widget/horizontalList.js

@@ -25,6 +25,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 import { View, Property, Superview } from "../ui/view";
 import { Stack } from "./layouts";
 import { layoutConfig } from "../util/layoutconfig";
+import { deepClone } from "./utils";
 export class HorizontalListItem extends Stack {
 }
 __decorate([
@@ -82,10 +83,11 @@ export class HorizontalList extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {

doric-js/lib/src/widget/list.js

@@ -25,6 +25,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 import { View, Property, Superview } from "../ui/view";
 import { Stack } from "./layouts";
 import { layoutConfig } from "../util/layoutconfig";
+import { deepClone } from "./utils";
 export class ListItem extends Stack {
 }
 __decorate([
@@ -86,10 +87,11 @@ export class List extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {

doric-js/lib/src/widget/slider.js

@@ -25,6 +25,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 import { Superview, View, Property } from "../ui/view";
 import { Stack } from "./layouts";
 import { layoutConfig } from "../util/layoutconfig";
+import { deepClone } from "./utils";
 export class SlideItem extends Stack {
 }
 __decorate([
@@ -60,10 +61,11 @@ export class Slider extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const slideItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return slideItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     slidePage(context, page, smooth = false) {
         return this.nativeChannel(context, "slidePage")({ page, smooth });

doric-js/lib/src/widget/utils.d.ts

@@ -0,0 +1,8 @@
+import { NativeViewModel } from "../ui/view";
+export declare function deepClone(nativeViewModel: NativeViewModel): {
+    id: string;
+    type: string;
+    props: {
+        [x: string]: import("../..").Model;
+    };
+};

doric-js/lib/src/widget/utils.js

@@ -0,0 +1,12 @@
+export function deepClone(nativeViewModel) {
+    const ret = {
+        id: nativeViewModel.id,
+        type: nativeViewModel.type,
+        props: Object.assign({}, nativeViewModel.props),
+    };
+    if (nativeViewModel.props.subviews) {
+        ret.props.subviews = nativeViewModel.props.subviews
+            .map(e => deepClone(e));
+    }
+    return ret;
+}

doric-js/src/widget/flowlayout.ts

@@ -17,6 +17,7 @@ import { Stack } from './layouts'
 import { Property, Superview, View, NativeViewModel } from '../ui/view'
 import { layoutConfig } from '../util/index.util'
 import { BridgeContext } from "../runtime/global";
+import { deepClone } from './utils';
 
 export class FlowLayoutItem extends Stack {
     /**
@@ -142,17 +143,20 @@ export class FlowLayout extends Superview {
         this.cachedViews.clear()
         this.itemCount = 0
     }
+
     private getItem(itemIdx: number) {
         let view = this.renderItem(itemIdx)
         view.superview = this
         this.cachedViews.set(`${itemIdx}`, view)
         return view
     }
+
     private renderBunchedItems(start: number, length: number) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx)
+            .fill(0).map((_, idx) => this.getItem(start + idx))
-            return listItem.toModel()
+        const ret = items.map(e => deepClone(e.toModel()))
-        })
+        items.forEach(e => e.clean())
+        return ret
     }
 
     toModel(): NativeViewModel {

doric-js/src/widget/horizontalList.ts

@@ -19,6 +19,7 @@ import { Stack } from "./layouts";
 import { layoutConfig } from "../util/layoutconfig";
 import { BridgeContext } from "../runtime/global";
 import { Color } from "../util/color";
+import { deepClone } from "./utils";
 
 export class HorizontalListItem extends Stack {
     /**
@@ -151,10 +152,11 @@ export class HorizontalList extends Superview {
     }
 
     private renderBunchedItems(start: number, length: number) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx)
+            .fill(0).map((_, idx) => this.getItem(start + idx))
-            return listItem.toModel()
+        const ret = items.map(e => deepClone(e.toModel()))
-        })
+        items.forEach(e => e.clean())
+        return ret
     }
 
     toModel(): NativeViewModel {

doric-js/src/widget/list.ts

@@ -19,6 +19,7 @@ import { Stack } from "./layouts";
 import { layoutConfig } from "../util/layoutconfig";
 import { BridgeContext } from "../runtime/global";
 import { Color } from "../util/color";
+import { deepClone } from "./utils";
 
 export class ListItem extends Stack {
     /**
@@ -154,10 +155,11 @@ export class List extends Superview {
     }
 
     private renderBunchedItems(start: number, length: number) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx)
+            .fill(0).map((_, idx) => this.getItem(start + idx))
-            return listItem.toModel()
+        const ret = items.map(e => deepClone(e.toModel()))
-        })
+        items.forEach(e => e.clean())
+        return ret
     }
 
     toModel(): NativeViewModel {

doric-js/src/widget/slider.ts

@@ -17,6 +17,7 @@ import { Superview, View, Property } from "../ui/view";
 import { Stack } from "./layouts";
 import { layoutConfig } from "../util/layoutconfig";
 import { BridgeContext } from "../runtime/global";
+import { deepClone } from "./utils";
 
 
 
@@ -92,10 +93,11 @@ export class Slider extends Superview {
     }
 
     private renderBunchedItems(start: number, length: number) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const slideItem = this.getItem(start + idx)
+            .fill(0).map((_, idx) => this.getItem(start + idx))
-            return slideItem.toModel()
+        const ret = items.map(e => deepClone(e.toModel()))
-        })
+        items.forEach(e => e.clean())
+        return ret
     }
 
     slidePage(context: BridgeContext, page: number, smooth = false) {

doric-js/src/widget/utils.ts

@@ -0,0 +1,16 @@
+import { NativeViewModel } from "../ui/view";
+
+export function deepClone(nativeViewModel: NativeViewModel) {
+    const ret = {
+        id: nativeViewModel.id,
+        type: nativeViewModel.type,
+        props: {
+            ...nativeViewModel.props
+        },
+    }
+    if (nativeViewModel.props.subviews) {
+        ret.props.subviews = (nativeViewModel.props.subviews as NativeViewModel[])
+            .map(e => deepClone(e));
+    }
+    return ret;
+}

doric-web/dist/index.js

@@ -3464,6 +3464,19 @@ function image(config) {
     return ret;
 }
 
+function deepClone(nativeViewModel) {
+    const ret = {
+        id: nativeViewModel.id,
+        type: nativeViewModel.type,
+        props: Object.assign({}, nativeViewModel.props),
+    };
+    if (nativeViewModel.props.subviews) {
+        ret.props.subviews = nativeViewModel.props.subviews
+            .map(e => deepClone(e));
+    }
+    return ret;
+}
+
 /*
  * Copyright [2019] [Doric.Pub]
  *
@@ -3549,10 +3562,11 @@ class List extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {
@@ -3699,10 +3713,11 @@ class Slider extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const slideItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return slideItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     slidePage(context, page, smooth = false) {
         return this.nativeChannel(context, "slidePage")({ page, smooth });
@@ -4094,10 +4109,11 @@ class FlowLayout extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {
@@ -4684,10 +4700,11 @@ class HorizontalList extends Superview {
         return view;
     }
     renderBunchedItems(start, length) {
-        return new Array(Math.max(0, Math.min(length, this.itemCount - start))).fill(0).map((_, idx) => {
+        const items = new Array(Math.max(0, Math.min(length, this.itemCount - start)))
-            const listItem = this.getItem(start + idx);
+            .fill(0).map((_, idx) => this.getItem(start + idx));
-            return listItem.toModel();
+        const ret = items.map(e => deepClone(e.toModel()));
-        });
+        items.forEach(e => e.clean());
+        return ret;
     }
     toModel() {
         if (this.loadMoreView) {