Vanilla JavaScript form validation

Most JavaScript form validation libraries are large, and often require other libraries like jQuery.

For example, MailChimp’s embeddable form includes a 140kb validation file (minified). It includes the entire jQuery library, a third-party form validation plugin, and some custom MailChimp code.

Today kicked-off a four-part series I wrote on vanilla JavaScript form validation for CSS Tricks.

In this series, I’m going to show you two lightweight ways to validate forms on the front end. Both take advantage of newer web APIs. I’m also going to teach you how to push browser support for these APIs back to IE9 (which provides you with coverage for 99.6% of all web traffic worldwide).

Finally, we’ll take a look at MailChimp’s sign-up form, and provide the same experience with 28× (2,800%) less code.

Dig into the first article on CSS Tricks now.