If you were trying to cool a room like with an air conditioner, yes. Heat pumps literally work in reverse, bringing heat in more efficiently than any resistive heater. They output more heat energy than they use, as they are moving heat, not generating it.
It’s doable and although I would best describe the dev experience as “ok”, it is improving over time.
Per your bullets
use newer module based js libraries, yes this is limiting but getting better support over time, and you still have to deal with issues cause by different library types when using a bundler
JSX will require a build step at some point, pushing that to runtime doesn’t improve anything. Instead I would favor lit html
probably true, but I would start without and wrap a bundler around the project when it becomes necessary, smaller projects will have a negligible effect. You should benchmark the differences yourself, and if you use es modules everywhere wrapping a bundler around it will be easy.
With the above you can get all the usual niceties too: hot reloading, lazy loading, etc