JSFiddle - React, Tailwind, and code Playground

HTML

<!-- Using large image dimensions to cause loading lag, demonstrating the image load effect  -->

<img src="http://placehold.it/3500x2500" width="350" height="250" class="fade-in-on-load">

CSS

.fade-in-on-load {
    opacity: 0;
    will-change: transition;
    -webkit-transition: opacity .09s ease-out;
    -moz-transition: opacity .09s ease-out;
    -ms-transition: opacity .09s ease-out;
    -o-transition: opacity .09s ease-out;
    transition: opacity .09s ease-out;
}

JavaScript

$(".fade-in-on-load").each(function(){
    if (!this.complete) {
        $(this).bind("load", function () {
            $(this).css('opacity', '1');
        });
    } else {
        $(this).css('opacity', '1');
    }
});