hoangtranson/index.html

## index.html
<!DOCTYPE html>
<html>

<head>
	<title>Prototype Performance</title>
	<meta charset="UTF-8" />
</head>

<body>
	<div id="app" style="margin:100px"></div>

	<script>
		function FuncNoPrototype() {
			this.value = 0;
			this.increment = function () {
				this.value++;
				console.log("printed: ", this.value);
			};
		}

		const t0 = (new Date()).getTime();
		for (let i = 0; i < 1000; i++) {
			const instanceNoPrototype = new FuncNoPrototype();
			instanceNoPrototype.increment();
		}
		const t1 = (new Date()).getTime();

		function FuncPrototype() {
			this.value = 0;
		}
		FuncPrototype.prototype.increment = function () {
			this.value++;
			console.log("printed: ", this.value);
		};

		const t2 = (new Date()).getTime();
		for (let i = 0; i < 1000; i++) {
			const instancePrototype = new FuncPrototype();
			instancePrototype.increment();
		}
		const t3 = (new Date()).getTime();

		document.getElementById("app").innerHTML = `
			<h1>time to create 1000 instances</h1>
			<div>without prototype: ${t1 - t0}</div>
			<div>with prototype: ${t3 - t2}</div>
		`;
	</script>
</body>

</html>
	<!DOCTYPE html>
	<html>

	<head>
	<title>Prototype Performance</title>
	<meta charset="UTF-8" />
	</head>

	<body>
	<div id="app" style="margin:100px"></div>

	<script>
	function FuncNoPrototype() {
	this.value = 0;
	this.increment = function () {
	this.value++;
	console.log("printed: ", this.value);
	};
	}

	const t0 = (new Date()).getTime();
	for (let i = 0; i < 1000; i++) {
	const instanceNoPrototype = new FuncNoPrototype();
	instanceNoPrototype.increment();
	}
	const t1 = (new Date()).getTime();

	function FuncPrototype() {
	this.value = 0;
	}
	FuncPrototype.prototype.increment = function () {
	this.value++;
	console.log("printed: ", this.value);
	};

	const t2 = (new Date()).getTime();
	for (let i = 0; i < 1000; i++) {
	const instancePrototype = new FuncPrototype();
	instancePrototype.increment();
	}
	const t3 = (new Date()).getTime();

	document.getElementById("app").innerHTML = `
	<h1>time to create 1000 instances</h1>
	<div>without prototype: ${t1 - t0}</div>
	<div>with prototype: ${t3 - t2}</div>
	`;
	</script>
	</body>

	</html>