Adding bottleneck vanilla test sites: number of elements, middleware,…

… and number of data requests

packages/react-server-test-pages/entrypoints.js

@@ -49,4 +49,16 @@ module.exports = {
 		entry: "/error/logs",
 		description: "Generate errors in the logs",
 	},
+	BottleneckElements: {
+		entry: "/bottleneck/elements",
+		description: "Test if number of elements on a page is a bottleneck",
+	},
+	BottleneckDataRequests: {
+		entry: "/bottleneck/dataRequests",
+		description: "Test if number of data requests on a page is a bottleneck",
+	},
+	BottleneckMiddleware: {
+		entry: "/bottleneck/middleware",
+		description: "Test if amount of middleware on a page is a bottleneck",
+	},
 }

packages/react-server-test-pages/pages/bottleneck/colors/blue.scss

@@ -0,0 +1,5 @@
+$blueish: blue;
+
+.blue-thing {
+	background-color: $blueish;
+}

packages/react-server-test-pages/pages/bottleneck/colors/green.scss

@@ -0,0 +1,5 @@
+$greenish: green;
+
+.green-thing {
+	background-color: $greenish;
+}

packages/react-server-test-pages/pages/bottleneck/colors/indigo.scss

@@ -0,0 +1,5 @@
+$indigoish: indigo;
+
+.indigo-thing {
+	background-color: $indigoish;
+}

packages/react-server-test-pages/pages/bottleneck/colors/orange.scss

@@ -0,0 +1,5 @@
+$orangeish: orange;
+
+.orange-thing {
+	background-color: $orangeish;
+}

packages/react-server-test-pages/pages/bottleneck/colors/purple.scss

@@ -0,0 +1,5 @@
+$purpleish: purple;
+
+.purple-thing {
+	background-color: $purpleish;
+}

packages/react-server-test-pages/pages/bottleneck/colors/red.scss

@@ -0,0 +1,5 @@
+$reddish: red;
+
+.red-thing {
+	background-color: $reddish;
+}

packages/react-server-test-pages/pages/bottleneck/colors/white.sass

@@ -0,0 +1,4 @@
+$whiteish: white
+
+.white-thing
+	background-color: $whiteish

packages/react-server-test-pages/pages/bottleneck/colors/yellow.scss

@@ -0,0 +1,5 @@
+$yellowish: yellow;
+
+.yellow-thing {
+	background-color: $yellowish;
+}

packages/react-server-test-pages/pages/bottleneck/dataRequests.js

@@ -0,0 +1,12 @@
+import {ReactServerAgent} from "react-server";
+
+export default class DataRequestsPage {
+
+	getElements() {
+		//Perform 1 million data requests before returning
+		for (var i = 0; i < 999999; i++) {
+			ReactServerAgent.get('/data/delay');
+		}
+		return (<div>Data requests complete!</div>);
+	}
+}

packages/react-server-test-pages/pages/bottleneck/elements.js

@@ -0,0 +1,33 @@
+import "./colors/red.scss";
+import "./colors/blue.scss";
+import "./colors/purple.scss";
+import "./colors/green.scss";
+import "./colors/orange.scss";
+import "./colors/indigo.scss";
+import "./colors/yellow.scss";
+
+const RedThing = () => <div className="red-thing">This should be red</div>;
+const BlueThing = () => <div className="blue-thing">This should be blue</div>;
+const PurpleThing = () => <div className="purple-thing">This should be purple</div>;
+const GreenThing = () => <div className="green-thing">This should be green</div>;
+const OrangeThing = () => <div className="orange-thing">This should be orange</div>;
+const IndigoThing = () => <div className="indigo-thing">This should be indigo</div>;
+const YellowThing = () => <div className="yellow-thing">This should be yellow</div>;
+const ColorWheel = [RedThing(), BlueThing(), PurpleThing(), GreenThing(),
+	OrangeThing(), IndigoThing(), YellowThing()];
+
+export default class ElementsPage {
+
+	getElements() {
+
+		const colorThings = [];
+		for (var i = 0; i < 99999; i++) {
+			let selection = Math.floor(Math.random() * 7);
+			colorThings.push(ColorWheel[selection]);
+		};
+
+		return (<div>
+			{colorThings}
+			</div>);
+	}
+}

packages/react-server-test-pages/pages/bottleneck/middleware.js

@@ -0,0 +1,32 @@
+import JsonResponseMiddleware from "react-server-middleware-json-response"
+
+
+export default class MiddlewarePage {
+
+	static middleware() {
+		return [JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware,
+			JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware, JsonResponseMiddleware];
+	}
+
+	getResponseData() {
+		return;
+	}
+}