Reborn performance tests based on Lighthouse

Word Count: 695
  • Post category:Reborn
  • Post last modified:2020-12-11

0 Home – Baseline

tested on 2020-12-05 0116
WP Super Cache : Off,
Autoptimize : Off

1 Home – Top slider removed

tested on 2020-12-05 0243
WP Super Cache : Off,
Autoptimize : Off

  • Top R-slider removed

2 Home – Bottom Blog-slider removed

tested on 2020-12-05 2143
WP Super Cache : Off,
Autoptimize : Off

  • Top R-slider removed
  • Bottom Blog Slider removed

3 Home – Middle image optimized

tested on 2020-12-05 2212
WP Super Cache : Off,
Autoptimize : Off

  • Top R-slider removed
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)

The image is for mobile view, therefore the result is same as Test 2

4 Home – Bottome R-slider removed

tested on 2020-12-05 2225
WP Super Cache : Off,
Autoptimize : Off

  • Top R-slider removed
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)
  • Bottom R-slider removed

 

5 Home – Enable Autoptimize

tested on 2020-12-05 2240
WP Super Cache : Off,
Autoptimize : ON

  • Top R-slider removed
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)
  • Bottom R-slider removed
  • Enabled Autoptimize. This has a great improvement!
    • Aggregate JS-files?: On
    • Aggregate CSS-files?: On

6 Home – Top R-slider restored

tested on 2020-12-05 2340
WP Super Cache : Off,
Autoptimize : ON

  • Top R-slider restored^^
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)
  • Bottom R-slider removed
  • Enabled Autoptimize. This has a great improvement!
    • Aggregate JS-files?: On
    • Aggregate CSS-files?: On

7 Home – Bottom R-slider restored

tested on 2020-12-06 0030
WP Super Cache : Off,
Autoptimize : ON

  • Top R-slider restored
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)
  • Bottom R-slider restored^^
  • Enabled Autoptimize. This has a great improvement!
    • Aggregate JS-files?: On
    • Aggregate CSS-files?: On

8 Home – WP Super Cache enabled

tested on 2020-12-06 0030
WP Super Cache : ON,
Autoptimize : ON

  • Top R-slider restored
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)
  • Bottom R-slider restored
  • Enabled Autoptimize. This has a great improvement!
    • Aggregate JS-files?: On
    • Aggregate CSS-files?: On
  • Enabled WP Super Cache^^
    • Preload activated

9 Home – Lazy Load Image enabled (Autoptimise)

tested on 2020-12-06 0030
WP Super Cache : ON,
Autoptimize : ON

  • Top R-slider restored
  • Bottom Blog Slider removed
  • Middle image (for mobile) optimized (439K to 100K)
  • Bottom R-slider restored
  • Enabled Autoptimize. This has a great improvement!
    • Aggregate JS-files?: On
    • Aggregate CSS-files?: On
  • Enabled WP Super Cache
    • Preload activated
  • Enabled Lazy Load image in Autoptimise^^

Observations

  • Folder Assets – combine CSS and JS files. Each standalone file is a http request which slows down the site. It is found that if Aggregate JS-files option and Aggregate CSS-files option are enabled in Autoptimise, the individual files are combined.
  • What is the purpose of bottom Blog Slider?
  • The Aggregate JS-files and Aggregate CSS-files options in Autoptimise has great positive effect.
  • Remove unused Plugins, e.g. there are two Hello Dolli.
  • In mobile view, cannot swipe the bottom R-slider. Slider Touch setting to be adjusted.
  • ——————-
  • ‘Remove Google Font’ in Autoptimise has positive effect.
  • Some of the images on innovriver are not optimized. This may also happen in the real site.
  • Images for both desktop and mobile are downloaded to browser in one-go.
  • Try to preload font files in header.php (see https://wp-rocket.me/blog/font-preloading-best-practices/)
  • Appears that in order to serve Webp images, the .htaccess has to be modified. 
  • Before production, remove cu-debug-functions.php and any function calls in templates and functions.php (the include statement)
  • In font CSS, some fonts are incorrectly specified as opentype.

Action done

  • Preloaded below font files in header.php.
    1. https://innovriver.com/test-wptheme/wp-content/themes/fonts/NotoSansTC-Regular.ttf
    2. https://innovriver.com/test-wptheme/wp-content/themes/fonts/NotoSansTC-Bold.ttf
    3. https://innovriver.com/test-wptheme/wp-content/plugins/revslider/public/assets/fonts/revicons/revicons.woff?5510888
    4. https://innovriver.com/test-wptheme/wp-content/themes/fonts/NotoSansSC-Light.ttf
    5. https://innovriver.com/test-wptheme/wp-content/themes/fonts/NotoSansSC-Regular.ttf
    6. https://innovriver.com/test-wptheme/wp-content/themes/fonts/NotoSansSC-Bold.ttf
    7. https://innovriver.com/test-wptheme/wp-content/themes/dalia/framework/lib/icons-pack/elegant-icons/fonts/ElegantIcons.woff
    8. https://innovriver.com/test-wptheme/wp-content/themes/dalia/framework/lib/icons-pack/ion-icons/fonts/ionicons.ttf?v=2.0.0
    9. https://innovriver.com/test-wptheme/wp-content/themes/dalia/framework/lib/icons-pack/font-awesome/webfonts/fa-solid-900.woff2
  • In Theme option -Fonts, changed Font family from ‘Noto Sans’ to ‘default’ for all headings and p.
  • In Theme option -General, Google Font Family remains as  ‘Noto Sans’, no change.
  • In Autoptimse – Extra, turned on ‘Remove Google Fonts’.
  • In Autoptimse – Image, turned on ‘Lazy Load’.
  • In ‘reborn_subcat.php’, used the wp_head and wp_footer to add css /js to header and footer.
  • Used ‘Asset Cleanup’ plugin to unload unwanted CSS and JS files for home page.
Tags: