Performance mark on binary

src/api-base.js

@@ -7,6 +7,7 @@ import {
 } from '@storage';
 import DerivAPIBasic from '@deriv/deriv-api/dist/DerivAPIBasic';
 import { observer as globalObserver } from '@utilities/observer';
+import APIMiddleware from './api-middleware';
 
 const socket_url = `wss://${getServerAddressFallback()}/websockets/v3?app_id=${getAppIdFallback()}&l=${getLanguage().toUpperCase()}&brand=deriv`;
 
@@ -30,6 +31,7 @@ class APIBase {
         try {
             this.api = new DerivAPIBasic({
                 connection: new WebSocket(socket_url),
+                middleware: new APIMiddleware({}),
             });
 
             this.api_chart = null;

src/api-middleware.js

@@ -0,0 +1,87 @@
+export const REQUESTS = [
+    'active_symbols',
+    'authorize',
+    'balance',
+    'buy',
+    'proposal',
+    'proposal_open_contract',
+    'run-proposal',
+    'transaction',
+    'ticks_history',
+    'history',
+];
+
+class APIMiddleware {
+    constructor(config) {
+        this.config = config;
+        this.debounced_calls = {};
+        this.addGlobalMethod();
+    }
+
+    // eslint-disable-next-line class-methods-use-this
+    getRequestType = request => {
+        let req_type;
+        REQUESTS.forEach(type => {
+            if (type in request && !req_type) req_type = type;
+        });
+
+        return req_type;
+    };
+
+    // eslint-disable-next-line class-methods-use-this
+    defineMeasure = res_type => {
+        if (res_type) {
+            let measure;
+            if (res_type === 'proposal') {
+                performance.mark('first_proposal_end');
+                if (performance.getEntriesByName('bot-start', 'mark').length) {
+                    measure = performance.measure('run-proposal', 'bot-start', 'first_proposal_end');
+                    performance.clearMarks('bot-start');
+                    // eslint-disable-next-line no-console
+                    console.table('bot-first-run', measure.duration);
+                }
+            }
+            if (res_type === 'history') {
+                performance.mark('ticks_history_end');
+                measure = performance.measure('ticks_history', 'ticks_history_start', 'ticks_history_end');
+                // eslint-disable-next-line no-console
+                console.table('ticks_history', measure.duration);
+            } else {
+                performance.mark(`${res_type}_end`);
+                measure = performance.measure(`${res_type}`, `${res_type}_start`, `${res_type}_end`);
+                if (res_type === 'proposal') {
+                    // eslint-disable-next-line no-console
+                    console.table('proposal', measure.duration);
+                }
+            }
+            return (measure.startTimeDate = new Date(Date.now() - measure.startTime));
+        }
+        return false;
+    };
+
+    sendIsCalled = ({ response_promise, args: [request] }) => {
+        const req_type = this.getRequestType(request);
+        if (req_type) performance.mark(`${req_type}_start`);
+        response_promise.then(res => {
+            const res_type = this.getRequestType(res);
+            if (res_type) {
+                this.defineMeasure(res_type);
+            }
+        });
+        return response_promise;
+    };
+
+    // eslint-disable-next-line class-methods-use-this
+    sendRequestsStatistic = () => {
+        // REQUESTS.forEach(req_type => {
+        //    const measure = performance.getEntriesByName(req_type);
+        // });
+        performance.clearMeasures();
+    };
+
+    addGlobalMethod() {
+        if (window) window.sendRequestsStatistic = this.sendRequestsStatistic;
+    }
+}
+
+export default APIMiddleware;

src/components/ToolBox/ToolBox.jsx

@@ -232,7 +232,10 @@ const ToolBox = ({ blockly, is_workspace_rendered }) => {
                 id_container='runButton'
                 tooltip={translate('Run the bot')}
                 position='bottom'
-                onClick={() => globalObserver.emit('blockly.start')}
+                onClick={() => {
+                    globalObserver.emit('blockly.start');
+                    performance.mark('bot-start');
+                }}
                 classes={classNames('toolbox-button icon-run', {
                     'toolbox-hide': !is_workspace_rendered,
                 })}