Kanmi Obasa
March 25th, 2023

Debugging UBA's Core Web Vitals Issues

On mobile, the Union Bank of Nigeria's website is relatively slow compared to other banking websites in the world.

According to PageSpeed Insights, the First Contentful Paint (FCP), which is usually the first sight of content one sees to signify that the page is indeed loading, starts at 4.9 seconds. Note that for First Contentful Paint to be considered good, it should be less than 1.8 seconds. The Largest Contentful Paint (LCP), which is usually the largest asset on the page, is recorded at 8.3 seconds, and less than 14% of actual Chrome users experience LCP load times of less than 2.5 seconds. This generally means the user will have to wait for a little over 8 seconds for the page to have loaded the important contents in the viewport.

The general assumption is that if a page takes more than 5 seconds to load, user frustration starts to sky rocket. With the Union Bank of Nigeria's website, this seems to be the case.

There are quick fixes that can be employed to fix the speed issues with the website. Using Chrome DevTools (Show Coverage), you can see what portion of the assets being loaded on the page are actually used. An asset, /sassy-social-share, which is about 120kb, is being loaded, and 100% of it is not used by the website. There are other assets that can be optimized. Eliminating unused CSS and JS could play a huge role in reducing both FCP and LCP.

Taking a closer look under the hood, there are several JS files at the top of the head tag, all of which will have to compile before CSS starts to render. Read more about addressing FCP issues in our weblog, "How big Is Your Head Tag" to learn more about how to reduce the white screen presented to users before the content begins to render.

A suggestion to have the head in this order below could be beneficial:

  • Meta Tags
  • Preload Assets
  • Preconnect Assets
  • Stylesheets
  • Scripts

Test this out and see if it improves the FCP and LCP.

Already interested!

Don‘t wait and start now !

Let's discuss ways to improve‘your business on the web.

Knfrmd is a web engineering consulting company with a team of highly skilled Software Engineers, Web Developers, SEO specialists, Graphic Designers, and Project Managers.

© 2024 Knfrmd Web Corp.