Changeset 57083

Timestamp:

11/08/2023 10:30:21 AM (3 years ago)

Author:

swissspidy

Message:

Build/Test Tools: Expand performance test scenarios.

Adds new tests for localized sites as well as the dashboard.
Also amends Server-Timing output to measure memory usage in all scenarios.

Props swissspidy, joemcgill, flixos90, mukesh27, mamaduka.
See #59656.
Fixes #59815.

Location:

trunk

Files:

• .github/workflows/performance.yml (modified) (1 diff)
• tests/performance/compare-results.js (modified) (3 diffs)
• tests/performance/log-results.js (modified) (1 diff)
• tests/performance/playwright.config.js (modified) (1 diff)
• tests/performance/results.js (modified) (1 diff)
• tests/performance/specs/admin-l10n.test.js (added)
• tests/performance/specs/admin.test.js (added)
• tests/performance/specs/home-block-theme-l10n.test.js (added)
• tests/performance/specs/home-block-theme.test.js (modified) (1 diff)
• tests/performance/specs/home-classic-theme-l10n.test.js (added)
• tests/performance/specs/home-classic-theme.test.js (modified) (1 diff)
• tests/performance/wp-content/mu-plugins/server-timing.php (modified) (1 diff)

trunk/.github/workflows/performance.yml

@@ -163 +163 @@
           npm run env:cli -- rewrite structure '/%year%/%monthnum%/%postname%/' --path=/var/www/${{ env.LOCAL_DIR }}
 
+      - name: Install additional languages
+        run: |
+          npm run env:cli -- language core install de_DE --path=/var/www/${{ env.LOCAL_DIR }}
+          npm run env:cli -- language plugin install de_DE --all --path=/var/www/${{ env.LOCAL_DIR }}
+          npm run env:cli -- language theme install de_DE --all --path=/var/www/${{ env.LOCAL_DIR }}
+
       - name: Install MU plugin
         run: |

trunk/tests/performance/compare-results.js

@@ -24 +24 @@
 
 // The list of test suites to log.
-const testSuites = [ 'home-block-theme', 'home-classic-theme' ];
+const testSuites = [
+        'admin',
+        'admin-l10n',
+        'home-block-theme',
+        'home-block-theme-l10n',
+        'home-classic-theme',
+        'home-classic-theme-l10n',
+];
 
 // The current commit's results.
@@ -129 +136 @@
 console.log( 'Note: Due to the nature of how GitHub Actions work, some variance in the results is expected.\n' );
 
+/**
+ * Nicely formats a given value.
+ *
+ * @param {string} metric Metric.
+ * @param {number} value
+ */
+function formatValue( metric, value) {
+        if ( null === value ) {
+                return 'N/A';
+        }
+        if ( 'wpMemoryUsage' === metric ) {
+                return `${ ( value / Math.pow( 10, 6 ) ).toFixed( 2 ) } MB`;
+        }
+
+        return `${ value.toFixed( 2 ) } ms`;
+}
+
 for ( const key of testSuites ) {
         const current = testResults[ key ] || {};
@@ -142 +166 @@
         for ( const [ metric, values ] of Object.entries( current ) ) {
                 const value = median( values );
-                const prevValue = median( prev[ metric ] );
+                const prevValue = prev[ metric ] ? median( prev[ metric ] ) : null;
 
-                const delta = value - prevValue;
+                const delta = null !== prevValue ? value - prevValue : 0
                 const percentage = ( delta / value ) * 100;
                 rows.push( {
                         Metric: metric,
-                        Before: `${ prevValue.toFixed( 2 ) } ms`,
-                        After: `${ value.toFixed( 2 ) } ms`,
-                        'Diff abs.': `${ delta.toFixed( 2 ) } ms`,
+                        Before: formatValue( metric, prevValue ),
+                        After: formatValue( metric, value ),
+                        'Diff abs.': formatValue( metric, delta ),
                         'Diff %': `${ percentage.toFixed( 2 ) } %`,
                 } );

trunk/tests/performance/log-results.js

@@ -12 +12 @@
 // The list of test suites to log.
 const testSuites = [
+        'admin',
+        'admin-l10n',
         'home-block-theme',
+        'home-block-theme-l10n',
         'home-classic-theme',
+        'home-classic-theme-l10n',
 ];
 

trunk/tests/performance/playwright.config.js

@@ -20 +20 @@
         ...baseConfig,
         globalSetup: require.resolve( './config/global-setup.js' ),
-        reporter: process.env.CI
-                ? './config/performance-reporter.js'
-                : [ [ 'list' ], [ './config/performance-reporter.js' ] ],
+        reporter: [ [ 'list' ], [ './config/performance-reporter.js' ] ],
         forbidOnly: !! process.env.CI,
         workers: 1,

trunk/tests/performance/results.js

@@ -9 +9 @@
 
 const testSuites = [
+    'admin',
+    'admin-l10n',
     'home-classic-theme',
+    'home-classic-theme-l10n',
     'home-block-theme',
+    'home-block-theme-l10n',
 ];
 

trunk/tests/performance/specs/home-block-theme.test.js

@@ -42 +42 @@
                         const serverTiming = await metrics.getServerTiming();
 
-                        for ( const [key, value] of Object.entries( serverTiming ) ) {
+                        for ( const [ key, value ] of Object.entries( serverTiming ) ) {
                                 results[ camelCaseDashes( key ) ] ??= [];
                                 results[ camelCaseDashes( key ) ].push( value );

trunk/tests/performance/specs/home-classic-theme.test.js

@@ -41 +41 @@
                         const serverTiming = await metrics.getServerTiming();
 
-                        for (const [key, value] of Object.entries( serverTiming ) ) {
+                        for ( const [ key, value ] of Object.entries( serverTiming ) ) {
                                 results[ camelCaseDashes( key ) ] ??= [];
                                 results[ camelCaseDashes( key ) ].push( value );

trunk/tests/performance/wp-content/mu-plugins/server-timing.php

@@ -26 +26 @@
                                 $server_timing_values['total'] = $server_timing_values['before-template'] + $server_timing_values['template'];
 
+                                /*
+                                 * While values passed via Server-Timing are intended to be durations,
+                                 * any numeric value can actually be passed.
+                                 * This is a nice little trick as it allows to easily get this information in JS.
+                                 */
+                                $server_timing_values['memory-usage'] = memory_get_usage();
+
                                 $header_values = array();
                                 foreach ( $server_timing_values as $slug => $value ) {