30 ms·

Ask HN: Show Me a Fast React/Vue/Angular Site

19 points by leeoniya 7y ago

Hi HNers! Can someone point me to a fast non-trivial React/Vue/Angular website? I don't mean hide-the-latency "fast". I mean, don't-waste-my-battery-or-bandwidth fast. I'd like to record a DevTools perf timeline and see < 100ms of total JS execution and < 500ms for full page load (excluding images/media). By non-trivial I mean a real-world, deployed app/site (not demo/mvp). An e-commerce site would be ideal but anything like Github, Airbnb, Facebook, Instagram, etc. I'm asking because I've literally never encountered one; they all seem to load 500KB+ of js, make 200 HTTP requests and execute 1500ms+ of js during page load (on a desktop browser). Then I look at the DOM via `document.querySelectorAll("*").length` see there's only 1,000 total DOM nodes rendered.

codingdave 7y ago
Yes, many people over-develop their sites. That doesn't mean a fast, small site is impossible. But most people are not trying to build the fastest most elegant site in the world - they are trying to solve a problem, and < 100ms isn't likely to be a requirement for most real-world solutions. Likewise, what does it matter how many DOM nodes there are, if it gets the job done? If you are trying to argue that people should think about whether or not they need a framework, I'd agree. I'd also agree that framework-supported sites do make it difficult to use resources efficiently on mobile devices. But this post feels analogous to criticizing a parent because their minivan isn't as cool as your convertible roadster. It isn't supposed to be. It just is supposed to get a job done.
- muzani 7y ago
  There's a lot out there where the loading time is several seconds long. Battery drain is really high too. I left my phone with a Vue site active and it drained down to 30% from 80% overnight. There are plenty of situations where websites need speed - Google, social media type sites, anything with user exploration like wikis and IMDB, games. I'd actually love to hear the question answered because my main concern with most frameworks is speed.
  - soulchild37 7y ago
    Facebook is the extreme counter example lol, its slow as hell and make my web browser hangs if I leave it for more than 15 minutes
AndreFvchs 7y ago
VuePress is pretty fast: https://vuepress.vuejs.org/ https://vuepress.vuejs.org/ It's relatively early in development. Runs on Vue JS and Markdown
- leeoniya 7y ago
  not sure generated static sites fit the bill.
soneca 7y ago
I am not sure if you want to make a point or if it is a genuine question. If it is a genuine question, why do you need to find such site?
- leeoniya 7y ago
  > I am not sure if you want to make a point or if it is a genuine question. it's both. i'm almost finished writing an SSR'd e-commerce site that easily surpasses these metrics using a not-the-big-three vdom layer and thinking about documenting the experience in a web-perf article(s) once it's deployed. i don't want to make the claim that such websites don't currently exist (for a multitude of reasons) without asking for some help in finding at least one counter-example; i've searched for a long time already and have come up empty.
Fr33maan 7y ago
I know you said nodemo but their demo store is quite complete and close from a real world website, it's a ecommerce solution built on react. They open sourced it, it's called cezerin. https://store.cezerin.com/ https://store.cezerin.com/ EDIT: didn't check if it was online but apparently they stoped it
chatmasta 7y ago
To have a fair discussion about this, you should probably also consider subsequent page loads after the first. With something like next.js, you get almost instant page loads after the first, because they are routed client side. If the app is designed properly, the 500kb bundle is only loaded once, and cached until a new one is released. Subsequent requests are for data only. Also, be sure not to conflate react performance with degradations due to third party marketing scripts.

19 points by leeoniya 7y ago

codingdave 7y ago

Yes, many people over-develop their sites. That doesn't mean a fast, small site is impossible. But most people are not trying to build the fastest most elegant site in the world - they are trying to solve a problem, and < 100ms isn't likely to be a requirement for most real-world solutions. Likewise, what does it matter how many DOM nodes there are, if it gets the job done? If you are trying to argue that people should think about whether or not they need a framework, I'd agree. I'd also agree that framework-supported sites do make it difficult to use resources efficiently on mobile devices. But this post feels analogous to criticizing a parent because their minivan isn't as cool as your convertible roadster. It isn't supposed to be. It just is supposed to get a job done.

muzani 7y ago
There's a lot out there where the loading time is several seconds long. Battery drain is really high too. I left my phone with a Vue site active and it drained down to 30% from 80% overnight. There are plenty of situations where websites need speed - Google, social media type sites, anything with user exploration like wikis and IMDB, games. I'd actually love to hear the question answered because my main concern with most frameworks is speed.
- soulchild37 7y ago
  Facebook is the extreme counter example lol, its slow as hell and make my web browser hangs if I leave it for more than 15 minutes

AndreFvchs 7y ago

VuePress is pretty fast: https://vuepress.vuejs.org/ https://vuepress.vuejs.org/ It's relatively early in development. Runs on Vue JS and Markdown

leeoniya 7y ago
not sure generated static sites fit the bill.

soneca 7y ago

I am not sure if you want to make a point or if it is a genuine question. If it is a genuine question, why do you need to find such site?

leeoniya 7y ago
> I am not sure if you want to make a point or if it is a genuine question. it's both. i'm almost finished writing an SSR'd e-commerce site that easily surpasses these metrics using a not-the-big-three vdom layer and thinking about documenting the experience in a web-perf article(s) once it's deployed. i don't want to make the claim that such websites don't currently exist (for a multitude of reasons) without asking for some help in finding at least one counter-example; i've searched for a long time already and have come up empty.

Fr33maan 7y ago

I know you said nodemo but their demo store is quite complete and close from a real world website, it's a ecommerce solution built on react. They open sourced it, it's called cezerin. https://store.cezerin.com/ https://store.cezerin.com/ EDIT: didn't check if it was online but apparently they stoped it

chatmasta 7y ago

To have a fair discussion about this, you should probably also consider subsequent page loads after the first. With something like next.js, you get almost instant page loads after the first, because they are routed client side. If the app is designed properly, the 500kb bundle is only loaded once, and cached until a new one is released. Subsequent requests are for data only. Also, be sure not to conflate react performance with degradations due to third party marketing scripts.