Appdex performance issues due to safe svg plugin

[cjyabraham]

Over the last 24 hours we've been receiving a number of Appdex performance alerts from lfeventsci. Safe SVG plugin is slowing load time of pages with a lot of SVGs. I've filed an issue with the plugin, however, we could also consider using a different SVG plugin that is more performant. Here is the key stack trace from New Relic:

[cjyabraham]

I've upgraded the Safe SVG plugin which might help.

[cjyabraham]

This error is likely being triggered because we are now getting 10x more traffic to the kubecon europe site, however, this still isn't the level of traffic we had pre-COVID, so we should be able to handle it. I took a look at the last 14 problematic transactions based on singular.php. All of them involved the kubecon europe landing page.

On 7, the slowest part of the load was due to safe_svg::svg_dimensions function called by the Safe SVG plugin. On the other 7, the slowest part of the load was due to api.flickr.com REST call from the Photonic plugin. Usually both slow down the load by about 40% each.

The average load time of these transactions looks to be about 6s, which is not terrible considering the vast majority of users will get a cached version of the page and not have to wait for this.

To deal with the Photonic plugin, it'd be good to see if this REST call can be cached. If not, perhaps we need to stop making a dynamic call to Flickr like this and just load the images from WordPress. I've asked about caching to the Photonic author.

For the svg function, the slowness is a result of rendering all the SVG logos. Due to the sheer number on the page, this slows down the load. We may want to experiment with an alternative SVG plugin which doesn't have a costly "dimensions" call in order to render the SVG on the front-end.

[cjyabraham]

The reason this has only started to become a problem is because Kubecon Europe traffic has been multiplied by 10 recently so that page is now disproportionately affecting site performance data. The page has 169 SVGs that need rendering. Additionally, there is a flickr gallery that renders conditionally for logged in users.

Both Photonic and SVG plugins have responded to the potential performance issues, however, I don't see a way to mitigate them currently.

Keep in mind that almost all public users will get the cached version of the page which renders almost instantaneously.

To reduce the number of alerts I have changed the Apdex T in New Relic to be 1s instead of 0.5s and will keep an eye on this.

[cjyabraham]

Closing for now as there have been no new alerts.

[cjyabraham]

These alerts started happening again.

[cjyabraham]

I've forked the safe-svg plugin and created a filter for avoiding calling the svg_dimensions function when loading sponsors. After deploying, TTFB times for loading Kubecon EU have gone from 2.34s to 1.01s. I'll keep this issue open while I monitor the Appdex ratings.

[cjyabraham]

Here is a chart showing the effect of this deployment:

I have submitted my patch upstream.

I'm closing this issue for now. At some point in the future we could migrate off the photonic plugin and just use built-in galleries. This would eliminate the flickr api calls which were also sometimes an issue without a major degradation in UX. I've split out another issue for that #566.