onInput performance ( even crash browser )

Hi, I am using onInput for my input field. here’s the emitter:

emitter.on('inputUsername', (e) => {
		let input = e.target.value
		if(input.length < 9){
			if(input === '' || input.match(/^[a-z0-9]+$/i)){
				state.input.username = input.toLowerCase()
				emitter.emit('render')
			}
			else{
				state.input.username = input.slice(0, input.length - 1)
				emitter.emit('render')
			}
		}
		else{
			emitter.emit('render')
		}
	})

While typing a lot of characters, for example a,b,c,backspace,backspace,d,e, etc will crash the browser ( google chrome in my case ). After a bit of research, the google chrome dump is telling me that the browser ran out of memory.

Also, while testing on my mobile devices the browser doesnt crash but the performance is so bad. After I press a character in the keyboard, the dom need about .3s - .5s to rerender it.

Is there any solution? I need to make sure the username field less than 9 chars and alphanumeric only.

[yoshuawuyts]

Oh; glad to hear it’s not us! — if you ever run into more slowdowns (especially with long lists), we now have an issue to handle that! https://github.com/choojs/nanomorph/issues/85

On Wed, Oct 11, 2017 at 8:24 AM Rahmat Albariqi [e-mail] wrote:

@yoshuawuyts https://github.com/yoshuawuyts just start a new project and using choo. This time oninput does not crash and run smoothly. My previous project that had oninput crash is using JSS ( https://github.com/cssinjs/jss) which uses a lot of variables as classname. I think JSS is causing the slow down, even crash.

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/choojs/choo/issues/564#issuecomment-335792272, or mute the thread https://github.com/notifications/unsubscribe-auth/ACWleovTLhMsEgQoz8vADxC4RtVp6i8vks5srLOHgaJpZM4PZTwm .

[bcomnes]

Perhaps we could figure out if there is something going on between choo and jss.