Wix Site Slow to Load After Implementing Custom Code

Ask the community
, ,
1

Hi Wix Studio Community,

I’ve recently added some custom JavaScript code to my Wix site to improve user interaction (e.g., form validation and custom animations), but now I’m noticing that the site is taking significantly longer to load. The page load time has gone from about 2 seconds to over 8 seconds, which is affecting the user experience.

Here’s what I’ve done so far:

  1. Verified that the custom code is working as intended but noticed the performance drop after adding it.
  2. Checked the performance metrics using Google PageSpeed Insights and identified a large delay in script execution times.
  3. Tried removing the custom code and found that the site loads as expected without it.
  4. Made sure the images and other media files are optimized for faster loading times.

Could the custom code be conflicting with other elements of my site, or are there best practices for adding custom scripts to Wix without causing significant slowdowns? I’m looking for suggestions to optimize the site’s performance without losing the custom functionality.

Thanks in advance for your help!

2

Hi, Not sure anyone can really answer your question without seeing and knowing exactly what the code is doing!

Can you post it, and include any details of how it is being called, hooked up to the page/form etc.

More detail the better.

1 Like
4

Thanks for responding! I understand that it’s difficult to diagnose the issue without seeing the code. Below is a summary of what the custom JavaScript does and how it’s integrated into the site:

  1. Form Validation:
  • The script validates user input on a custom form (e.g., checking email format, required fields, etc.).
  • It’s hooked into the form submission event using addEventListener.
  • Example snippet:
const form = document.getElementById('customForm');
form.addEventListener('submit', (e) => {
    e.preventDefault();
    const email = document.getElementById('email').value;
    if (!validateEmail(email)) {
        alert('Please enter a valid email address');
    }
});

function validateEmail(email) {
    const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    return re.test(email);
}

Custom Animations:

  • Animations are triggered when users scroll to certain sections of the page using Intersection Observer API.
  • Example snippet:
const observer = new IntersectionObserver((entries) => {
    entries.forEach((entry) => {
        if (entry.isIntersecting) {
            entry.target.classList.add('animate');
        }
    });
});

document.querySelectorAll('.animated-section').forEach((section) => {
    observer.observe(section);
});
  1. Integration Details:
  • The script is added through the Wix Code panel and loaded on all pages where these interactions are needed.
  • The animations and form scripts are combined in a single script file, which is executed on page load.

The Google PageSpeed Insights report points to high script execution time and increased Total Blocking Time (TBT) after adding this code.

Do you have recommendations for optimizing the script execution? For example, would splitting the code into smaller modules or lazy-loading certain parts help? Or are there specific Wix Studio best practices for ensuring custom JavaScript doesn’t degrade site performance?

Thanks again for your guidance! Let me know if you need more details.

5

You’re trying to use native JavaScript on a Wix website, Wix does not allow you access to the DOM, read the Velo documentation

7

Hi,

You can try this speed optimization app for Wix Studio to improve core web vitals & web page speed.
It’s quick to set up—about 5 minutes—and comes with a 14-day free trial. Install it here:

8

@DeanAyalon , I suspect this code is added through the Settings > Advance, where AFAIK Native JS is allowed.

@joerehan ,

Maybe add the custom code for the validation and without the animation. See if it speeds up. If it does then the issue like related to the Intersection Observer API/Animation.

I honestly cannot see it being the Validation, unless you are getting errors with it. Check the console logs.