Step 01: Setting Up Playwright for HTML to PDF Conversion

First, ensure Node.js is installed on your machine. If not, download it from nodejs.org.

Then, install Playwright via npm:

npm

This command automatically includes all necessary browser engines (Chromium, Firefox, WebKit).

Step 02: Generating Your First "Hello World" PDF

Creating a PDF with Playwright involves running a simple Node.js script. Let's create our first basic example:

Alternative 01: Generating PDF from a URL

Here’s how you can generate a PDF from any URL:

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.pdf({ path: 'example.pdf', format: 'A4' });
  await browser.close();
})();

This script:

• Opens a headless Chromium browser

• Navigates to your chosen URL

• Saves the resulting PDF

Alternative 02: Generating PDF from an HTML File

If you already have an HTML file or a raw HTML string, follow these steps:

Directly using a string without a file:

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  const htmlContent = '<h1>Hello World</h1><p>This is your first PDF generated by Playwright.</p>';
  await page.setContent(htmlContent);
  await page.pdf({ path: 'hello-world.pdf', format: 'A4' });
  await browser.close();
})();

Playwright Print Configurations (Footer, Header, Margins, etc.)

Playwright allows detailed customizations, such as setting headers, footers, margins, and more:

await page.pdf({
  path: 'configured.pdf',
  format: 'Letter',
  margin: { top: '20px', bottom: '20px' },
  displayHeaderFooter: true,
  headerTemplate: '<span style="font-size:10px;">Header content</span>',
  footerTemplate: '<span style="font-size:10px;">Page <span class="pageNumber"></span></span>'
});

Refer to the Playwright Print Configuration documentation for more detailed options.

Using HTML Template Engines

For dynamic HTML generation, template engines like Handlebars, EJS, or Pug can streamline the process. Here’s an example using Handlebars:

const handlebars = require('handlebars');
const template = handlebars.compile('<h1>{{title}}</h1><p>{{content}}</p>');
const html = template({ title: 'Hello', content: 'Generated PDF content.' });

await page.setContent(html);
await page.pdf({ path: 'templated.pdf', format: 'A4' });

Step 03: Creating a Serverless Architecture to Scale PDF Generation

Playwright can be resource-intensive, consuming significant memory and processing power when rendering complex HTML content. To efficiently handle high volumes of PDF generation requests, using a serverless architecture like AWS Lambda is highly beneficial. This approach reduces costs by scaling automatically and only consuming resources when needed.

Note that you must install the browser engine (e.g., Chromium) on the Lambda layer or any other serverless service you're using. While various installation guides exist online, what worked best for me was using a dockerized container to install the browser engine effectively.

I’ve prepared a detailed step-by-step guide to help you set this up, available here.

Alternative: Convert HTML to PDF Using pdf noodle

Managing HTML-to-PDF conversion at scale can quickly become a nightmare!

Especially in serverless environments where cold starts, memory limits, and headless browser quirks love to break at the worst possible time (we even wrote a full article about it). Add constant template iterations, version control headaches, and the need to support non-technical contributors, and suddenly your “simple PDF library” turns into an ongoing engineering project.

pdf noodle eliminates all of that.

Instead of maintaining brittle infrastructure or wrestling with outdated pdf libraries, pdf noodle gives you a battle-tested PDF generation API that just works!

Fast, scalable, and designed for both developers and non-developers. You send raw HTML or use our AI-powered template builder, and pdf noodle handles the rendering, scaling, optimization, and delivery so your team doesn’t have to.

Here's an example of a simple API request to generate your pixel-perfect PDF with just a few lines of code:

fetch('https://api.pdfnoodle.com/v1/html-to-pdf/sync', {
  method: 'POST',
  body: JSON.stringify({ html:'your-html' } }),
  headers: { 'Authorization' : 'Bearer your-api-key' }
});

pdf noodle also includes a powerful AI Agent that can generate PDF templates instantly, along with a modern editor for refining the design, also using AI, to match your brand. You don't need developing or design experience to quickly update layouts, adjust styling, and manage template versions.

Here’s a quick demo showing how it works:

You can create your account and design your first template without any upfront payment.

Conclusion

Playwright is a robust, versatile tool for generating PDFs from HTML. Its ability to render pixel-perfect PDFs, combined with rapidly increasing popularity, positions it as an exceptional solution for generating high-quality PDFs with complex layouts at scale.

If you don't want to waste time maintaining pdfs layouts and their infrastructure or if you don't want to keep track of best practices to generate PDFs at scale, third-party PDF APIs like pdf noodle will save you hours of work and deliver a high quality pdf layout.