Rayrun
← Back to Discord Forum

playwright goto method takes a long time it is redirecting to localhost it takes 13seconds

I feel a bit lost why it takes so long is their a way to improve speed here when goto method I using headless chrome

This thread is trying to answer question "Why does the playwright goto method take so long to redirect to localhost and how can this be improved?"

7 replies

the website is loading quite a lot of JS and css

prashantbellad
prashantbellad

I am also facing this issue. Are there any solution?

@prashantbellad try using goto method with load Dom content

It helped me

prashantbellad
prashantbellad

@pregot it did not help unfortunately

refactoreric

Does the same page load quickly when opening it manually with the same browser? If so, it might be worth posting a GitHub issue.

If not, it sounds like a problem with the page itself.

Was thinking along the same as @refactoreric, would assert another difference is PW wll normally start with a bare bones, i.e. no cache pages, this could be a huge penalty as well.

Answer

Speeding Up 'goto' in Playwright

When you're using Playwright's 'goto' method to load a website with lots of JavaScript and CSS files, it can take a while. This is because the browser needs to fetch and process all these resources. If there are dependencies between these resources or if they're loaded asynchronously, it can slow things down even more.

How to Speed Things Up

Here are some ways you can make things faster:

Minify and Compress Resources

Minifying JavaScript and CSS files removes unnecessary characters, reducing their size. Compressing them with gzip or brotli can make them even smaller.

import { test } from '@playwright/test';

test('minify and compress resources', async ({ page }) => {
  await page.goto('https://ray.run');
  // Add your minification and compression code here
});

Use Caching

Enable caching headers on your server. This means the browser can serve static resources from cache, rather than fetching them from the server each time.

Optimize Resource Loading Order

Make sure critical resources like main scripts and stylesheets are loaded first. This means the important content is rendered quickly.

Lazy-Load Non-Critical Resources

Defer loading non-essential scripts or styles until they're needed. This can be done using asynchronous loading or dynamically injecting resources.

Use Code Splitting

Split large JavaScript bundles into smaller chunks. This means the browser only needs to download and execute the necessary code for a particular page or feature.

Optimize Server Response Time

Make sure your server can handle requests efficiently. This includes optimizing database queries, reducing network latency, and using caching mechanisms.

Use a CDN

Consider using a content delivery network (CDN). This distributes your static resources across multiple servers worldwide, reducing the distance between users and the server hosting these files.

By following these best practices, you can make the 'goto' method in Playwright load websites faster, improving speed and performance.

Related Discord Threads

TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.