Most users do not see a noticeable impact on their site performance when Privy is installed. This is because Privy aims to remain as lightweight as possible regardless of your install method. That said, Privy offers both synchronous and asynchronous code options to provide the best compatibility with your site, and these code formats impact site performance differently.
Optimization and hosting
The Privy engineering team is constantly working to optimize the load times and file sizes associated with the widget used to display your Privy displays. Additionally, each iteration of the widget references assets in a world-class content delivery network (CDN) with an average response time under 10 milliseconds. To learn more about the benefits of a CDN, click here.
Installation method
Synchronous code - This is the recommended option for a manual install of Privy. Synchronous code is executed in sequence wherein each statement waits for the previous statement to finish before executing. This code format allows the installer to determine the relative order of code execution on their site, which means Privy could load faster or slower based on the site's configuration.
Asynchronous code - This is the default option when Privy is installed on your site via an integration such as Shopify or Wix. This code format yields to your site, loading as passively as possible, always giving your site precedence. It does not block any content or scripts on your page from loading. This means Privy’s assets are not placed on the critical render path for your site. While web page analysis tools may show that Privy loads later than other resources, this is entirely intentional.
Evaluating Privy's impact
Note: Familiarity with Google Chrome's developer tools is recommended.
To review and better understand Privy's impact on your site performance:
- Using Google Chrome, navigate to a site page that includes the Privy code.
- Open the browser's DevTools by pressing Control+Shift+J (PC) or Command+Option+J (Mac).
- Switch to the Network tab and then reload the page.
- As the page loads, the tab will populate with information. Each row represents a resource. By default, the resources are listed chronologically.
- Locate the Widget.JS resource to review its information. The most relevant information concerning performance are Status (Did the widget load properly with a 200 OK?), Time (How long did the widget take to load?), and Waterfall placement (When did it load? Did it allow other more important resources to take precedence?).
In the example below, the widget is loaded asynchronously. The site's content is given priority over the Privy widget and the page's associated display.
To learn more about using this tool for performance evaluation, click here.