DEV Community: Aman Suryavanshi

Building 99.7% Reliable n8n Workflows: The Validation Guide

Aman Suryavanshi — Tue, 17 Feb 2026 13:37:59 +0000

How I Fixed the "Empty Object" Bug in n8n (and Hit 99.7% Reliability)

TL;DR:

Webhooks often send empty objects ({}) for cancellations, which JavaScript treats as "truthy."
Standard array length checks fail when n8n returns [{}].
A 3-layer validation system (Structure, ID, and Data) prevents blank emails from reaching customers.

Prerequisites

Basic knowledge of n8n workflows.
Understanding of JavaScript truthy/falsy values.
Experience handling webhooks from tools like Cal.com or Typeform.

The Problem: The Silent Killer of Automations

I recently faced a nightmare scenario while building a lead management system for the Aviators Training Centre. 40% of my booking confirmation emails were sending with blank data.

No name. No meeting time. Just empty fields.

Users received emails saying: "Hi , your meeting is scheduled for " with awkward blank spaces where their information should be. It looked unprofessional and risked losing potential students.

After deep-diving into the n8n execution logs, I found the culprit. Cal.com sends webhooks for both bookings and cancellations. When a cancellation happened, the payload was an empty object: {}.

Because n8n has alwaysOutputData: true enabled by default in many nodes, these empty objects passed through my filters. In JavaScript, an empty object is technically truthy, so my "if data exists" checks were waving them through to the email node.

What I Tried First (That Failed)

Before I found the solution, I went through several failed attempts that I'm sure many of you have tried too:

Attempt 1: Checking array length

if (bookingData.length > 0) return bookingData;

Why it failed: n8n often wraps the payload in an array. An array containing an empty object [{}] still has a length of 1.

Attempt 2: The simple truthy check

if (bookingData[0]) return bookingData;

Why it failed: As mentioned, {} is truthy. The check passes, but there is no usable data inside.

Attempt 3: Checking for a specific field

if (bookingData[0].id) return bookingData;

Why it failed: If the id field is missing entirely, this throws a null reference error and crashes the whole workflow execution.

The Solution: 3-Layer Validation Architecture

To solve this, I built a multi-layer validation system. This architecture ensures that only "healthy" data makes it to the final stages of the workflow.

Layer 1: Array Structure Check

First, we verify if we even have a list of data to look at. This catches completely empty responses or null values.

Layer 2: ID Field Validation

Next, we check if a unique identifier exists. Since I was using Airtable and Cal.com, I looked for an ID that followed a specific format (like starting with 'rec').

Layer 3: Meaningful Data Check

Finally, we ensure the object has more than just one or two keys. If an object only has an ID but no name or email, it's still useless for a confirmation email.

Implementing the Full Validation Function

Here is the exact code I used in a Code Node to filter out the noise. This function uses "semantic indicators" - if no valid data is found, it returns a specific flag (_noLeadsFound) that downstream nodes can easily recognize.

// src/utils/validation.js

function isValidLead(item) {
  // Layer 1: Check if the item and json property exist
  if (!item || !item.json) return false;

  const data = item.json;

  // Layer 2: Check ID exists and matches expected format
  if (!data.id || !data.id.startsWith('rec')) return false;

  // Layer 3: Check for required fields (Name, Email, Start Time)
  if (!data.name || !data.email || !data.startTime) return false;

  // Final Check: Ensure it's not just an object with an ID
  if (Object.keys(data).length <= 1) return false;

  return true;
}

const validLeads = items.filter(isValidLead);

if (validLeads.length === 0) {
  // Return a semantic indicator instead of an empty array
  return [{ json: { _noLeadsFound: true } }];
}

return validLeads;

The "Smart Indicator" Pattern

One of the biggest lessons I learned was using the _noLeadsFound flag. Instead of letting the workflow stop or error out, I pass this flag to an IF Node later in the flow:

// IF Node Condition
$input.first().json && 
!$input.first().json._noLeadsFound && 
$input.first().json.id

This prevents the "Empty Object" from ever reaching the email template, while still allowing the workflow to finish gracefully.

The Results: 99.7% Reliability

After deploying this 3-layer architecture at the Aviators Training Centre, the results were immediate.

Reliability: Jumped from 60% to 99.7%.
Blank Emails: Dropped to 0%.
Production Stats: Over 42 consecutive checks passed across three different triggers (Cal.com, Firebase, and Booking Management) with zero errors.

I no longer have to spend hours debugging execution logs to find out why a customer received a broken email. The system handles the edge cases automatically.

Key Takeaways

Never trust webhook data: Always assume the payload might be empty or malformed.
Objects are tricky: Remember that [{}] is truthy and has a length of 1.
Use Semantic Indicators: Passing a flag like _noLeadsFound is much cleaner than trying to handle nulls in every single node.
Validate in layers: Catch structure issues first, then ID issues, then data completeness.

Bookmark this pattern for the next time you build a customer-facing automation. It will save you from a lot of embarrassing "Hi [Blank]" emails.

What's your approach?

I used a custom Code Node for this validation, but I have seen people use complex chains of Filter nodes to achieve something similar. Which do you prefer: writing a bit of JavaScript or keeping it strictly no-code with more nodes?

I'm documenting my entire build-in-public journey here on Dev.to. If you want more practical n8n and Next.js patterns, hit the follow button.

Let's connect:

Next.js Lighthouse Optimization: 42 to 97 Case Study

Aman Suryavanshi — Sat, 24 Jan 2026 04:46:03 +0000

How I Boosted My Next.js Lighthouse Score from 42 to 97

We’ve all been there: you build a beautiful Next.js site, deploy it, and then run a Lighthouse audit only to see a sea of red circles.

That was me a few months ago. My project, the Aviators Training Centre website, launched with a Performance score of 42. Google ignored us, organic traffic was non-existent, and the Largest Contentful Paint (LCP) was a painful 5.8 seconds.

But after a systematic optimization, I pushed that score to 97. The result? We hit Page 1 on Google, generated over 50 organic leads, and drove ₹3 lakh+ in revenue.

TL;DR:

Images: Used next/image with priority loading to reduce size by 93%.
Code Splitting: Implemented dynamic imports to cut the main bundle by 67%.
Business Impact: Better Core Web Vitals = Page 1 rankings and real revenue.

Prerequisites

Before we dive in, you should have:

A basic understanding of Next.js and React.
A site deployed (or running locally) that you want to optimize.
Lighthouse (built into Chrome DevTools) to measure your progress.

The Problem: Why "Good Enough" Isn't Enough

When I first checked the metrics, they were grim:

First Contentful Paint (FCP): 3.2s (Target: <1.8s)
Largest Contentful Paint (LCP): 5.8s (Target: <2.5s)
Cumulative Layout Shift (CLS): 0.18 (Target: <0.1)

Google's algorithm prioritizes fast websites. If your site is slow, you aren't just annoying users—you're effectively invisible to search engines.

The 5-Step Optimization Strategy

1. Image Optimization (The Biggest Win)

Images are usually the heaviest part of any site. I switched every standard <img> tag to the Next.js <Image /> component. This automatically handles WebP conversion and resizing.

For "above-the-fold" images (like your Hero section), the priority prop is your best friend. It tells the browser to fetch that image immediately.

// src/components/HeroImage.js
import Image from 'next/image';

export default function HeroImage() {
  return (
    <Image
      src="/courses/cpl-training.png"
      alt="CPL Training"
      width={800}
      height={600}
      quality={85}
      priority={true} // Critical for LCP!
      placeholder="blur"
      sizes="(max-width: 768px) 100vw, 50vw"
    />
  );
}

2. Smart Code Splitting

Why load a heavy admin dashboard or a syntax highlighter on the homepage? You shouldn't. I used Next.js dynamic imports to ensure users only download the code they actually need.

// src/pages/index.js
import dynamic from 'next/dynamic';

// This component only loads when it's about to enter the viewport
const Testimonials = dynamic(
  () => import('@/components/Testimonials'),
  {
    loading: () => <div className="animate-pulse">Loading...</div>,
    ssr: false // Set to false if it doesn't need to be rendered on the server
  }
);

3. Font Optimization

Render-blocking fonts are a silent killer. Using next/font allows you to host fonts locally and use font-display: swap to prevent the "Flash of Invisible Text."

// src/layout.js
import { Inter } from 'next/font/google';

const inter = Inter({
  subsets: ['latin'],
  display: 'swap',
  variable: '--font-inter',
  preload: true,
});

4. Script Loading Strategy

Third-party scripts (Analytics, Chatbots) often hog the main thread. I used the next/script component to control exactly when these scripts load.

afterInteractive: For analytics (loads early but doesn't block).
lazyOnload: For non-critical scripts like chat widgets.

5. Aggressive Caching

For assets that rarely change (like your logo or UI icons), tell the browser to keep them for a long time. I updated my next.config.js to include immutable cache headers.

// next.config.js
module.exports = {
  async headers() {
    return [
      {
        source: '/:all*(svg|jpg|png|webp)',
        headers: [
          {
            key: 'Cache-Control',
            value: 'public, max-age=31536000, immutable',
          },
        ],
      },
    ];
  },
};

The Results: Numbers Don't Lie

After implementing these changes, the transformation was incredible:

Performance: 42 → 97
LCP: 5.8s → 1.4s (4x faster)
TBT (Total Blocking Time): 890ms → 120ms (7x reduction)

This technical cleanup led to Page 1 rankings for 20+ keywords and 19,300 impressions in just 6 months.

Key Takeaways for Your Next Project

Lighthouse is a business tool: A high score isn't just for ego; it's for SEO and conversions.
Optimize early: Don't wait until after launch. We lost two months of potential traffic because we deployed a slow site first.
Use the built-ins: Next.js provides Image, Font, and Script components for a reason. Use them!

What’s your biggest struggle when it comes to web performance? Is it third-party scripts, heavy images, or something else? Let’s chat in the comments! I’d love to hear how you handle these bottlenecks.

If you found this helpful, feel free to connect with me—I'm always happy to talk Next.js and automation!

How I Built an Organic Lead Gen Machine: A ₹3 Lakh Case Study

Aman Suryavanshi — Fri, 16 Jan 2026 15:47:24 +0000

How I Replaced ₹50k/Month Ad Spend with a Next.js + n8n Lead Machine

TL;DR:

I built a full-stack lead generation system for a flight school that cut ad spend to zero while generating ₹3,00,000+ in revenue.
The stack uses Next.js 14, n8n, Firebase, and Airtable—all running on ₹0/month infrastructure costs.
Key technical win: A non-blocking webhook architecture that ensures 99.7% reliability even if the automation backend is busy.

Prerequisites

To follow along with this architecture, you should have a basic understanding of:

Next.js (App Router & API Routes)
Webhooks (How to send and receive JSON data)
Low-code automation (Basic familiarity with n8n or Zapier)

The Problem: 100% Ad Dependency

I recently worked with Aviators Training Centre, a premier DGCA ground school in India. When we started, they were caught in a classic "ad-spend trap":

Bleeding Cash: Spending ₹35,000–₹50,000/month on Facebook ads.
High CPL: Paying nearly ₹800 per lead.
Manual Chaos: Leads were scattered across WhatsApp, and the owner spent 4 hours a day on admin work instead of teaching.

The client asked me: "Can we stop depending on paid ads?"

I said yes. But to do that, we didn't just need a website; we needed a revenue machine.

The Architecture: The "Zero-Cost" Stack

I chose tools that offer generous free tiers or can be self-hosted to keep the overhead at exactly ₹0/month:

Frontend: Next.js 14 (Vercel) for SSR and SEO.
Database: Firebase Realtime DB (Free Tier) for instant lead storage.
Automation: n8n (Self-hosted) to glue everything together.
CRM: Airtable for a visual sales pipeline.
CMS: Sanity.io for SEO-optimized blog content.

1. The Non-Blocking Webhook Pattern

One of the biggest mistakes I see beginners make is making the user wait for an automation to finish. If your n8n server is slow, your user sees a spinning wheel—or worse, a timeout error.

I built a non-blocking architecture. The Next.js API route saves the data to Firebase immediately and triggers the webhook in the background. The user gets a "Success" message in milliseconds.

// src/app/api/lead/route.ts
import { db } from '@/lib/firebase';
import { ref, push } from 'firebase/database';

export async function POST(req: Request) {
  const data = await req.json();

  try {
    // 1. Save to Firebase immediately (The Source of Truth)
    await push(ref(db, 'leads'), {
      ...data,
      timestamp: Date.now(),
    });

    // 2. Trigger n8n Webhook (Background task)
    // We don't 'await' this if we want maximum speed,
    // or we use a try/catch to ensure user UX isn't broken.
    fetch(process.env.N8N_WEBHOOK_URL!, {
      method: 'POST',
      body: JSON.stringify(data),
    }).catch(err => console.error("n8n Trigger Failed:", err));

    return new Response(JSON.stringify({ success: true }), { status: 200 });
  } catch (error) {
    return new Response(JSON.stringify({ error: 'Database failure' }), { status: 500 });
  }
}

2. Solving the Lead Attribution Mystery

If you're moving away from ads, you need to know where your organic leads are coming from. I built a simple UTM tracking utility that captures URL parameters and stores them in the browser session.

// src/utils/trackUtm.js
export const getUtmParams = () => {
  if (typeof window === 'undefined') return {};

  const params = new URLSearchParams(window.location.search);
  return {
    source: params.get('utm_source') || 'organic',
    medium: params.get('utm_medium') || 'direct',
    campaign: params.get('utm_campaign') || 'none',
    content: params.get('utm_content') || 'none',
  };
};

When a user submits a form, we bundle these UTMs with their contact info. This allowed the client to see that 15% of their high-quality leads were actually coming from AI search engines like Perplexity and ChatGPT!

Key Challenges & "Aha!" Moments

The n8n "Empty Object" Bug

Early on, 40% of our booking confirmations were sending blank emails. I realized that if the webhook payload was slightly malformed, n8n would still execute but with empty data.

The Fix: I implemented a 3-layer validation system inside n8n using an "If Node" to check for the existence of the email and name fields before proceeding. Reliability shot up from 60% to 99.7%.

Lighthouse Optimization

SEO was our primary growth driver. By using Next.js next/image and aggressive code splitting, I took the Lighthouse score from under 50 to 95+. This single change pushed 20+ keywords to Page 1 of Google India within 4 months.

The Results (The Numbers Don't Lie)

Revenue: ₹3,00,000+ from organic leads.
Ad Spend: Reduced from ₹50,000/month to ₹0.
Admin Time: 4 hours/day → 30 mins/day (85% reduction).
Response Time: Leads get a personalized email/WhatsApp in <2 minutes instead of 6 hours.

Key Takeaways for Developers

UX is King: Never make your user wait for a third-party API (like n8n or Airtable). Save to your DB first, then trigger automations.
Free Tier Stacking is a Superpower: You don't need a huge budget to build professional-grade systems. Vercel + Firebase + Airtable is a lethal combo for small business clients.
Performance = Revenue: In this project, a 95+ Lighthouse score directly correlated to ₹3L in revenue. Speed isn't just a dev metric; it's a business metric.

What do you think?

I'm curious—how do you handle lead processing in your apps? Do you prefer a heavy backend like Node/Express, or are you leaning into the "Serverless + Automation" approach like I did here?

Let's discuss in the comments! 👇