The standard Paperform embed code is built to avoid impacting the overall load speed of the page. To do this, it doesn’t actually start loading the form until the page has finished loading the essentials of the page. However, if the form is an integral piece of the page content, you can do a few things to increase the speed at which the form loads.
One of the simplest and effective changes you can make to speed up the loading of the form is to replace the script part of the embed code with a standard script code, instead of inline JavaScript.
Our standard embed code
<div data-paperform-id="newsletter"></div>
<script>
(function() {
var script = document.createElement('script');
script.src = "https://paperform.co/__embed.min.js";
document.body.appendChild(script);
})()
</script>
Replace this script
<script>
(function() {
var script = document.createElement('script');
script.src = "https://paperform.co/__embed.min.js";
document.body.appendChild(script);
})()
</script>
With a standard script
<script src="https://paperform.co/__embed.min.js"></script>
The end result will look like
<div data-paperform-id="newsletter"></div>
<script src="https://paperform.co/__embed.min.js"></script>
Preferably in the head
.
The earlier the script is loaded, the faster the form can begin to load. This means if you move the script that we replaced above higher in the HTML document, it will prioritize the loading of the form over other third party inclusions on the page.
To do this, move the
<script src="https://paperform.co/__embed.min.js"></script>
into the head
of the page, or as high as you can if you don't have access to the entire page's HTML.
The fastest way to load an embedded form is by using the iframe
fallback method as outlined in the fallback documentation. If you go with this method, make sure you review the gotchas in the linked documentation to ensure this approach is right for you.