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

How I made Google’s data grid scroll faster with a line of CSS

medium.com

Post reply on HN
Print view View original

71–80 of 223 posts

Re: How I made Google’s data grid scroll faster with a line of CSS

#71

Post by vaughan »

xmprt wrote: post #24
eska wrote: post #10

I’m not a frontend dev so I just stick to vanilla html and js. I created a simple table with 40k rows, slapped an input box above it, and had some vanilla js set CSS visibility on all rows depending on whether they matched. This would update live as I was typing (10ms trigger delay). No optimizations. So what are frontend devs doing that they break all of this so badly? Are they just trying to be too smart, I wonder?

I had similar fears when implementing a large table with some data visualization during one of my first forays into web development. I had noticed how slow things with 100 elements were let alone 1000. When I wrote my code that handled much more than that, I was surprised how responsive it was. How does a company with thousands of employees manage to make something that runs more poorly than something I wrote in an a…

Frameworks.

Re: How I made Google’s data grid scroll faster with a line of CSS

#72

Post by gowld »

thrashh wrote: post #45
arendtio wrote: post #19

Earlier quoted context omitted.

> There should just be one way to do a scrolling list, implemented natively and left alone. Maybe this one implementation should not be implemented natively? (otherwise you would need a new implementation for every platform) However, I agree with you, that in the web development we are missing a mature component library. Everybody seems to build his own library when he needs one. In addition, the libraries to connect…

I think it’s a funding issue. A lot of desktop GUI toolkits were funded by the people who created the platform themselves so they had every incentive to make it both flexible and consistent. When I look for a web component, the few component libraries that cover several different components are often extremely incomplete. Often they’re just side projects of a company or even an individual. No one is putting in the mo…

> A lot of desktop GUI toolkits were funded by the people who created the platform themselves

Not Linux (GTK, QT).

And not Java Swing

Re: How I made Google’s data grid scroll faster with a line of CSS

#73

Post by ryandrake »

chiefalchemist wrote: post #70
agent327 wrote: post #13

Earlier quoted context omitted.

Maybe webdevelopers should stop trying to make everything look different from its defaults. It used to be that you could reliably predict what clicking the mouse in a region of the screen would do. It wasn't progress, when webdevelopers threw that out...

For the record...the issues you mention were initiated by former print designers, turned wannabe web designers. No one should underestimate the percentage of "web designers" who don't know the difference between a span and a div, or the damage that level of ignorance is doing. FFS, I still see PSDs (which is a silly format for web design) - already approved by clients - with small (read: difficult to read) font sizes…

> Don't blame the developers some of this do push back. Unfortunately, "the creatives" too often have more juice.

It's so bizarre how developers are simultaneously considered 1. powerful in the job market, highly in-demand, with companies competing for talent, and 2. totally powerless to push back against dark patterns, privacy invasions, and poor product or design choices.

I mean has anyone even tried saying "You know what, I'm not going to implement that. I'm a professional, too, and in my judgment it's [ridiculous | unethical | poorly thought out | whatever]. We need to negotiate it down to something better."

Not going after you in particular, but I see this "developer power" dichotomy all the time on HN and it's kind of hard to understand.

Re: How I made Google’s data grid scroll faster with a line of CSS

#74

Post by bgdkbtv »

Scottopherson wrote: post #40
eska wrote: post #10

I’m not a frontend dev so I just stick to vanilla html and js. I created a simple table with 40k rows, slapped an input box above it, and had some vanilla js set CSS visibility on all rows depending on whether they matched. This would update live as I was typing (10ms trigger delay). No optimizations. So what are frontend devs doing that they break all of this so badly? Are they just trying to be too smart, I wonder?

Filtering a list is easy when all the data exists on the client and has no advanced filtering controls. I'd love to slap an input box above a table and call it done but the product owners and designers that fill my backlog have other ideas. I'd love to make sure this CSS visibility filtering worked well for screenreaders and other accessibility tools but that ticket was pushed down the backlog in favor of replacing n…

Good lord, are you me?

Re: How I made Google’s data grid scroll faster with a line of CSS

#75

Post by secondaryacct »

thrashh wrote: post #45
arendtio wrote: post #19

Earlier quoted context omitted.

> There should just be one way to do a scrolling list, implemented natively and left alone. Maybe this one implementation should not be implemented natively? (otherwise you would need a new implementation for every platform) However, I agree with you, that in the web development we are missing a mature component library. Everybody seems to build his own library when he needs one. In addition, the libraries to connect…

I think it’s a funding issue. A lot of desktop GUI toolkits were funded by the people who created the platform themselves so they had every incentive to make it both flexible and consistent. When I look for a web component, the few component libraries that cover several different components are often extremely incomplete. Often they’re just side projects of a company or even an individual. No one is putting in the mo…

How much do you pay ? Because Syncfusion or Sencha have well funded well working stuff.

Re: How I made Google’s data grid scroll faster with a line of CSS

#76

Post by DigitalSea »

What makes this even more ironic, is that for a period of time, Chrome was one of the only browsers to support the contain property. I've been using this property for years to speed up my applications, it does have quirks (especially using strict), but reading up on the different modes it can offer huge performance gains for large apps.

Re: How I made Google’s data grid scroll faster with a line of CSS

#77

Post by dfabulich »

wildrhythms wrote: post #63
lxe wrote: post #3

I've been doing web development for 20 years now. I don't know if it's strictly endemic to web or frontend, but I feel like we're solving the same problems over and over again, using the same low levels of abstraction. There's no reason for lists to scroll slowly after so many years of scrolling lists. There should just be one way to do a scrolling list, implemented natively and left alone. Yet, in web development, t…

I work in UX, I am constantly being given designs that don't work well with native/semantic elements- a great example is tables. As soon as the table needs some kind of animation, drag-drop behavior, anything like that, I can't use a anymore; or it becomes some frankenstein kafkaesque amalgamation that is impossible to maintain. Does the table really need an animation? (probably not) drag and drop? (probably not) But…

What you need is Open UI. The browser vendors are working on it.

https://open-ui.org/

> The purpose of Open UI to the web platform is to allow web developers to style and extend built-in web UI controls, such as dropdowns, checkboxes, radio buttons, and date/color pickers.

> To do that, we'll need to fully specify the component parts, states, and behaviors of the built-in controls, as well as necessary accessibility requirements, and provide test suites to ensure compatibility. We'll also implement polyfills for our extensible web UI controls.

Re: How I made Google’s data grid scroll faster with a line of CSS

#78

Post by jamesfinlayson »

nawgz wrote: post #15
jaywalk wrote: post #8

Earlier quoted context omitted.

> There should just be one way to do a scrolling list, implemented natively and left alone. I can't even imagine how that would work without turning into something like that can only be minimally styled and has to be (usually poorly) re-implemented to get it to look the way you want it to.

You should see what you can do with and these days, no more do your native browser elements have to look like complete dog to receive free native device controls

I can't believe these elements slipped under my radar for so long - I have a site with no Javascript (outside of Google Analytics anyway) and and have helped me keep it that way.

Re: How I made Google’s data grid scroll faster with a line of CSS

#79

Post by arthurcolle »

dfabulich wrote: post #77
wildrhythms wrote: post #63

Earlier quoted context omitted.

I work in UX, I am constantly being given designs that don't work well with native/semantic elements- a great example is tables. As soon as the table needs some kind of animation, drag-drop behavior, anything like that, I can't use a anymore; or it becomes some frankenstein kafkaesque amalgamation that is impossible to maintain. Does the table really need an animation? (probably not) drag and drop? (probably not) But…

What you need is Open UI. The browser vendors are working on it. https://open-ui.org/ > The purpose of Open UI to the web platform is to allow web developers to style and extend built-in web UI controls, such as dropdowns, checkboxes, radio buttons, and date/color pickers. > To do that, we'll need to fully specify the component parts, states, and behaviors of the built-in controls, as well as necessary accessibility…

Mandatory standards xkcd
Post reply on HN