JSFiddle - React, Tailwind, and code Playground

HTML

<div id="effect"></div>

CSS

body{  background-color: #333}
#effect {
  font-family: Courier New,monospace;
  height: 26px;
  line-height: 30px;
  color:#0C0;
  }

JavaScript

(function( text, el) {
  var L = text.length
    ,cursor = 0
    ,arr
    ,timeout
    ,prob = 0.36 // вероятность "разгадывания" очередной позиции
    ,rate = 20  // частота "кадров" в секунду
    ,delay = 1000 / rate
    ,alphabet = []
    ,i
    ,aL
  ;
  
  // заполним алфавит из которого брать случайные символы
  for(i=12;i<=128;i++) alphabet.push( String.fromCharCode(i));
  //for(i=1024;i<=1279;i++) alphabet.push(String.fromCharCode(i));
  aL = alphabet.length;

  function tweak() {  
    arr = text.split('');
    for(pos = cursor; pos < L; pos++) {
      arr[pos] = alphabet[ Math.floor( aL * Math.random())];
    }
    el.innerText = arr.join('');
    
    if( cursor === L) return; // done
    
    if( Math.random() < prob) cursor++;
    timeout = window.setTimeout( tweak, delay);
  }

  tweak();
  
})( "H4CK3RSTY13", document.getElementById("effect") )