Comparing Heroku, Netlify, Vercel, and GitHub Pages for Node.js Projects

I’ve used Netlify on several projects. Now Vercel is coming up, so I decided to do a head-to-head comparison. It’s years since I touched Heroku, so I added it to the ring. I made a sample project, hosting the code on GitHub, so figured why not see how GitHub Pages measure up too.

The demo project I used is the Next.js blog tutorial. The code is here: github.com/olets/nextjs-on-all-the-hosts

Sites

• GitHub Pages: olets.github.io/nextjs-on-all-the-hosts
• Heroku: nextjs-on.herokuapp.com This site is down. You can imagine it, it looked like the others.
• Netlify: nextjs-on.netlify.app
• Vercel: nextjs-on.vercel.app

Contents

Deployment

GitHub Pages

• Real time timer shows how long a deployment has been running
• Production deploys can be triggered from the web UI
• The build command(s) can be configured in the configuration file

Heroku

• Duration of ongoing deploys is not surfaced
• Production deploys can be triggered from the web UI
• The build command can be configured in the configuration file

Netlify

• Duration of ongoing deploys is not surfaced
• The Next.js tutorial (https://nextjs.org/learn) deploy in approximately 1 minute
• Production deploys can be triggered from the web UI
• The build command can be configured in the web UI or the configuration file

Vercel

• Real time timer shows how long a deployment has been running
• The Next.js tutorial (https://nextjs.org/learn) deploy in approximately 20–40 seconds
• Production deploys cannot be triggered from the web UI
• The build command can be configured in the web UI

Branch deploys

GitHub Pages

• Branch deploys are not supported

Heroku

• Branch deploys are not supported

Netlify

• By default, only the trunk branch is deployed
• Supports deploying all branches
• Supports deploying select branches
• Branch domains are <7 digit commit SHA>--<production domain>.netlfiy.app by default
• Custom branch domains are supported for Netlify DNS users
• Branch deploys can be triggered from web UI

Vercel

• All branches are deployed
• Branch domains are <repo name>-<9 character commit SHA>-<user>.vercel.app by default
• Branches can be given custom vercel.app domains for free
• Branch deploys can be triggered from web UI

Analytics

GitHub Pages

• Analytics are not supported

Heroku

• Analytics are supported for paid accounts
• Metrics:
  • Response time
  • Throughput (number of requests)
  • Memory usage
  • Load
  • Events (e.g. errors, status changes, restarts, etc.)

Netlify

• Analytics are supported for paid accounts
• Metrics:
  • Pageviews
  • Unique visitors
  • Top locations
  • Top pages
  • Top resources not found
  • Top sources
  • Bandwidth used

Vercel

• Analytics are supported for Next.js, Nuxt.js, and Gatsby
• Free accounts can use analytics on a single project
• Metrics:
  • “Real Experience Score” (proprietary)
  • First contentful paint
  • Largest contentful paint
  • Cumulative layout shift
  • First input delay

GitHub Integration

Netlify

• Can comment on pull requests with
  • diff link (duplicates GitHub pull request UI functionality)
  • deploy log link
  • branch deploy URL

Vercel

• Can comment on pull requests with
  • deploy log link
  • branch deploy URL