search

milesmcc / shynet

Modern, privacy-friendly, and detailed web analytics that works without cookies or JS.
Apache License 2.0
2.89k stars 183 forks source link

Performance issue #261

Closed sparanoid closed 1 year ago

sparanoid commented 1 year ago

I have a medium-sized website that receives about 300k sessions and 1.5m pageviews per month. I switched to Shynet two weeks ago, but now I have noticed some performance issues with the chart. You can view the video demo here:

https://user-images.githubusercontent.com/96356/228383470-b59bf0d3-c26f-41eb-9f34-0f4dfdd98f92.mp4

After further investigation, I discovered that the issue may be due to the fact that the page is fully server-side rendered. The larger the website traffic, the more data needs to be loaded on the page. If the period is set to the last 30 days, the entire document initial download will be 1.9MB (after gzip compression):

image

A possible solution is to provide data through an API and replace the chart library with one that has better performance (like Apache EChart?).

leeoniya commented 1 year ago

maybe helpful: https://github.com/leeoniya/uPlot#performance

haaavk commented 1 year ago

Do charts on home page have the same issues? Server side rendering may cause long page load but not performance issues after. Chart shouldn't be a problem too. It has the same amount of data no matter how much traffic you have. My guess is too many things rendered into DOM. (For example to many locations or referrers)

sparanoid commented 1 year ago

Do charts on home page have the same issues?

Yeah you pointed it out. Charts on the home page are smooth as normal.

I removed the Location panel in the browser inspector, which had 10,000 nodes. This made the page back to normal. It appears that having too many HTML nodes was causing the issue.

image
haaavk commented 1 year ago

It's still a problem. I think locations and referral should show max top 100 results. @milesmcc What do you think?

sparanoid commented 1 year ago

A better way to handle large amounts of data is to retrieve it through an API and render it in the viewport dynamatically. But this would require a significant amount of refactoring.

milesmcc commented 1 year ago

I think we should show the top n for everything, rather than all... perhaps we add pagination somehow as well? That should really speed things up.

milesmcc commented 1 year ago

Would someone be able to submit a PR that does this? I'd merge quickly.

haaavk commented 1 year ago

There can be a button to open paginated view with all results. Just like with sessions. I can make PR tomorrow.