The Real-Time EmailValidation Blueprint

import React, { useState, useCallback } from 'react';
import { useDebounce } from 'use-debounce';
import { validateEmail } from '@any-xyz/email-check-api';

const EmailInput = () => {
 const [email, setEmail] = useState('');
 const [validation, setValidation] = useState(null);
 const [debouncedEmail] = useDebounce(email, 300);

 const validateEmailRealTime = useCallback(async (emailToCheck) => {
 if (!emailToCheck) return;

 try {
 const startTime = performance.now();
 const result = await validateEmail(emailToCheck, {
 timeout: 100,
 fastMode: true,
 parallelChecks: true
 });
 const endTime = performance.now();

 setValidation({
 ...result,
 responseTime: Math.round(endTime - startTime)
 });
 } catch (error) {
 setValidation({ isValid: false, error: error.message });
 }
 }, []);

 React.useEffect(() => {
 validateEmailRealTime(debouncedEmail);
 }, [debouncedEmail, validateEmailRealTime]);

 return (
 <div className="relative">
 <input
 type="email"
 value={email}
 onChange={(e) => setEmail(e.target.value)}
 className={`w-full px-4 py-2 border rounded-lg ${
 validation?.isValid === false ?'border-error/30' :
 validation?.isValid === true ?'border-success/30' :
'border-base-300'
 }`}
 placeholder="Enter your email"
 />

 {validation && (
 <div className="mt-2 text-sm">
 {validation.isValid ? (
 <span className="text-success flex items-center gap-1">
 ✓ Valid email ({validation.responseTime}ms)
 </span>
 ) : (
 <span className="text-error flex items-center gap-1">
 ✗ {validation.reason ||'Invalid email'}
 </span>
 )}
 </div>
 )}
 </div>
 );
};

const express = require('express');
const { EmailValidator } = require('@any-xyz/email-check-api');

const app = express();
const validator = new EmailValidator({
 timeout: 50,
 concurrency: 100,
 cacheSize: 10000
});

// Middleware for real-time validation
const validateEmailMiddleware = async (req, res, next) => {
 const { email } = req.body;

 if (!email) return next();

 try {
 const startTime = process.hrtime.bigint();

 const result = await Promise.race([
 validator.validateFast(email),
 new Promise((_, reject) =>
 setTimeout(() => reject(new Error('Timeout')), 100)
 )
 ]);

 const endTime = process.hrtime.bigint();
 const responseTime = Number(endTime - startTime) / 1000000;

 req.emailValidation = {
 ...result,
 responseTime: Math.round(responseTime)
 };

 next();
 } catch (error) {
 res.status(400).json({
 error:'Email validation failed',
 message: error.message,
 responseTime:'>100ms'
 });
 }
};

// Registration endpoint
app.post('/api/register', validateEmailMiddleware, async (req, res) => {
 const { email, password } = req.body;
 const validation = req.emailValidation;

 if (!validation.isValid) {
 return res.status(400).json({
 error:'Invalid email',
 reason: validation.reason,
 responseTime: validation.responseTime
 });
 }

 // Proceed with user creation
 const user = await createUser({ email, password });

 res.json({
 success: true,
 user: {
 id: user.id,
 email: user.email
 },
 validation: {
 responseTime: validation.responseTime,
 confidence: validation.confidence
 }
 });
});

// Optimize for performance
app.listen(3000, () => {
 console.log('Server running with real-time validation');
});