Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

You might want to build your WebApp in Canvas instead of HTML

hivekit.io

Post reply on HN
Print view View original

41–50 of 59 posts

Re: You might want to build your WebApp in Canvas instead of HTML

#41

Post by satvikpendem »

Lots of people here not reading the post and offering knee jerk responses when the author clearly states when and when not to use canvas rendering. For example, you could try making Figma in DOM but it is quite slow compared to Wasm and canvas rendering, as others like Penpot have seen.

For canvas rendering in general, this is essentially what Flutter and a lot of newer GUI frameworks like Composer Multiplatform and Rust based GUIs do. Accessibility is possible for these as there is semantic tree support but it's not as "free" as the DOM so it takes a bit more work.

Re: You might want to build your WebApp in Canvas instead of HTML

#42

Post by tarcon »

xnx wrote: post #21

Canvas will be increasingly popular in the arms race against ad blockers.

Had to remember how ads looked like when Flash was popular. We had fullscreen ads that interacted with the content!

Interactive Flash Banner Ads Animation from the 2000s https://www.youtube.com/watch?v=w0Lu8BsjvK0

Re: You might want to build your WebApp in Canvas instead of HTML

#43

Post by arjie »

Huh of course. I have a timeline element in our family EMR that I implemented in html out of ignorance. I just accepted the clickiness of zooming etc. I wonder if rendering it in canvas would make for a smoother zoom or if this is because I implemented it wrong. Lots of interesting work in web UI design.

Re: You might want to build your WebApp in Canvas instead of HTML

#44

Post by snoopen »

aboardRat4 wrote: post #35

There is no such a thing as a "WebApp". There are "web pages", which are just plain text html downloaded over http (or even ftp). In 99.9% of the cases it's completely enough.

There is absolutely such a thing as a web app. What else would you call Google Docs, MS Word and the like?

Re: You might want to build your WebApp in Canvas instead of HTML

#45

Post by sunnybeetroot »

josephg wrote: post #31

Please don't do this. Native controls have dozens to hundreds of subtle UI interactions. Consider a text input element. On macos there are text shortcuts - cmd+A to select all. cmd+left / right to go to the next or previous word. Page up / page down. Home / end. Spell check. A right click menu with about 10 more options, including OS based text services. Tapping on a text input element on ios or android will pull up…

Please read TFA

> for most web apps, you’re much better off with good old DOM elements. Take the humble element, for example. With it, you get crispy rendering at any resolution, support for tab, focus, selection, mouse interactions and arrow key navigation, internationalization for right-to-left text and Asian compound characters, accessibility for screen readers…

Re: You might want to build your WebApp in Canvas instead of HTML

#46

Post by anticrymactic »

evan_ wrote: post #8
martinbooth wrote: post #4

Earlier quoted context omitted.

It says: > For most web apps, the DOM remains the better choice. It gives you accessibility, responsive layouts, text selection, input handling, and countless other features for free

Ah, so literally a word. I was thinking you could probably get a fair bit of accessibility by using s for your text rendering- or by maintaining a separate, hidden outline of DOM elements mirroring what’s on screen.

> maintaining a separate, hidden outline of DOM elements mirroring what’s on screen.

Is there any analysis on the efficacy of this approach? This is always my first thought in these discussions. Performance of WASM with native text IO. Being fully "hidden" one could just use semantic elements, skipping most layout div's, maybe in turn reaping untold accessibility benefits?

Being such a simple idea I cannot believe that it wasn't tried and abandoned before.

Re: You might want to build your WebApp in Canvas instead of HTML

#47

Post by tomkarho »

For the tiniest of moment websites were made using Flash. Granted the technology was mostly games and video but on occasion a site popped up where everything was an interactive flash instead of plain old html. And before that there was java applets. This feels like a similar attempt.

Re: You might want to build your WebApp in Canvas instead of HTML

#48

Post by aboardRat4 »

snoopen wrote: post #44
aboardRat4 wrote: post #35

There is no such a thing as a "WebApp". There are "web pages", which are just plain text html downloaded over http (or even ftp). In 99.9% of the cases it's completely enough.

There is absolutely such a thing as a web app. What else would you call Google Docs, MS Word and the like?

Google Docs is a program for Android written in java and compiled into dalvik/art byte code. MS Word is just a program for Windows, written C/C++.

Re: You might want to build your WebApp in Canvas instead of HTML

#49

Post by josephg »

sunnybeetroot wrote: post #45
josephg wrote: post #31

Please don't do this. Native controls have dozens to hundreds of subtle UI interactions. Consider a text input element. On macos there are text shortcuts - cmd+A to select all. cmd+left / right to go to the next or previous word. Page up / page down. Home / end. Spell check. A right click menu with about 10 more options, including OS based text services. Tapping on a text input element on ios or android will pull up…

Please read TFA > for most web apps, you’re much better off with good old DOM elements. Take the humble element, for example. With it, you get crispy rendering at any resolution, support for tab, focus, selection, mouse interactions and arrow key navigation, internationalization for right-to-left text and Asian compound characters, accessibility for screen readers…

I did read the article. It is not a balanced piece. The title is “You might want to build your webapp in canvas instead”. Almost the entire article - basically everything except for that paragraph - is talking about canvas rendering. About when and why it might be better. There is nowhere near enough discussion of the downsides. If you read this article you could walk away thinking Google docs is implemented entirely on top of the canvas API. This couldn’t be further from the truth.

There are a lot of comments in this thread excited by the idea of turning my web browser into a dumb frame buffer for someone’s home grown, laggy, half baked UI framework that cannot function on par with the DOM for hard technical reasons. I don't want to run software like that.

Re: You might want to build your WebApp in Canvas instead of HTML

#50

Post by bryanrasmussen »

bryanrasmussen wrote: post #38
dinkelberg wrote: post #5

The dev tools in the browser become much more useless when you draw everything in a canvas. It's gonna be sad when everyone starts using frameworks that draw on canvases. Arguably more sad than when Webassembly came. One could probably write new dev tools for those frameworks though. I also imagine this will be a big setback for web accessibility.

yes, and a big setback for the companies that do this when all the accessibility lawsuits hit them.

evidently people do not like to be reminded that if they do inaccessible things they will be sued for it various jurisdictions, and I have been downvoted for not bringing good news.
Post reply on HN