JSFiddle - React, Tailwind, and code Playground
HTML
<input value="☆" autofocus>
<pre></pre>
JavaScript
var getUTF8Length = function(s,l,n,c) {
l = n = 0;
for (; s[n]; n++) {
if ((c = s.charCodeAt(n)) < 128) {
l++;
} else if (c > 127 && c < 2048) {
l += 2;
} else {
l += 3;
}
}
return l;
};
var pre = document.querySelector('pre');
document.querySelector('input').oninput = function() {
pre.innerHTML = getUTF8Length(this.value);
}