Live data from Hacker News

Hacker News Clone Using GraphQL and React

github.com

111–120 of 187 posts

Re: Hacker News Clone Using GraphQL and React

#111
The original HN is one of the fastest loading sites I regularly visit. You fixed that pretty good.

Disclaimer: I'm on terrible internet connections most of the time and it really makes you hate all this modern web crud. Often "dynamic" sites don't load at all because while the initial HTTP request eventually gets through, one or more of the following XMLHttpRequests or whatever fail, and a lot of the time there is no handler for retries, or no error handler at all, or moronic timeouts (either far too long or far too short).

Re: Hacker News Clone Using GraphQL and React

#112
I feel a little mixed about projects like this.

It's fantastic to see people share their knowledge, and turn theory into practice. It's very easy to spout on about best practices and good ideas without demonstrating how they can be implemented in the real world. And this application does demonstrate some good ideas.

...But some bad ideas also. I think one problem we have in the frontend world is that developers of very small, very simple sites are pulling in solutions entirely unsuited to their scale of problems. They think they are being careful and investing in an insurance against rapid expansion, but what they're actually doing is overspending on the wrong investments, making things expensive that don't need to be expensive, and betting against agility. This seems like a mistake.

I encounter too many teams who are building web applications by bunding a cornucopia of technologies they don't understand and allow "best practice" examples on GitHub and Medium to do their decision-making for them. They disengage critically from their technology choices, which has the short term benefit of getting them moving faster, but the long term cost of never developing their research and evaluation skills.

This is not your fault, of course. People always want a silver bullet, a framework prefabricated and ready for drop-in domain code. And to be fair, most websites are very like each other. I just wish software developers chose their tech a little more critically.

Re: Hacker News Clone Using GraphQL and React

#113
post #110

1) npm install added 1226 packages in 52.23s 2) $ ls -l node_modules/ | wc -l 900 3) $ du -h node_modules/ 180M node_modules/ 4) Few people care what your web app is built with. Your differentiating feature should be how it's used, not how its put together. In this case, it works exactly like the original, just with different internals. I don't see the point.

`npm install` pulls 1.6M SLOC. That's a little bit less than V8 itself.

    $ loc node_modules/
    --------------------------------------------------------------------------------
     Language             Files        Lines        Blank      Comment         Code
    --------------------------------------------------------------------------------
     JavaScript           15594      1681330       215398       283955      1181977
     Markdown              1831       246795        70260            0       176535
     JSON                  1602       167050          936            0       166114
     HTML                    86        37383         2511           18        34854
     TypeScript             289        26943         2895         5929        18119
     Jsx                     19        11072         1190          587         9295
     XML                     14         6533          466            4         6063
     C/C++ Header            21         7103         1126          403         5574
     YAML                   280         4697          199          166         4332
     Makefile                69         3611          733          844         2034
     C                        4         2219          271          291         1657
     CSS                     19         1428           84           34         1310
     Plain Text              81         1412          285            0         1127
     CoffeeScript            16         1260          181          106          973
     Python                   6          926          179           56          691
     ActionScript             4          904           89          227          588
     Autoconf                 2          778           70          256          452
     C++                      7          423           70           36          317
     Handlebars               6          262           30            0          232
     Bourne Shell            13          213           27           22          164
     OCaml                    1          156           23            0          133
     D                        6           69            0            0           69
     Batch                    2           18            1            0           17
     Lisp                     2           12            0            0           12
     GLSL                     2           11            2            0            9
     FORTRAN Legacy           1            0            0            0            0
    --------------------------------------------------------------------------------
     Total                19977      2202608       297026       292934      1612648
    --------------------------------------------------------------------------------

Re: Hacker News Clone Using GraphQL and React

#114
This technology stack really feels like the future, awesome work! React & GraphQL go so well together, I love Relay's and Apollo's approaches to couple the data requirements of a component with the component itself! This is such an awesome workflow for working with an API.

Also, a shameless plug: If you want to get started with GraphQL, check out https://www.howtographql.com. There's a basic introduction to GraphQL and many hands-on tutorials, e.g. for React with Apollo or Relay (including videos).

Re: Hacker News Clone Using GraphQL and React

#115

I feel a little mixed about projects like this. It's fantastic to see people share their knowledge, and turn theory into practice. It's very easy to spout on about best practices and good ideas without demonstrating how they can be implemented in the real world. And this application does demonstrate some good ideas. ...But some bad ideas also. I think one problem we have in the frontend world is that developers of ve…

This is exactly what I feel. I get heavy request to build projects in React where their use case is pretty simple even wordpress can suffice.

Re: Hacker News Clone Using GraphQL and React

#116
There are some oddly bad tempered responses here. The readme doesn’t suggest it’s necessarily the best way to implement HN. It’s not an opinion piece. It just lists a bunch of commonly used libraries, and documents rather nicely how to put them together.

I can see some value in describing alternative or better ways to do what this web app does, or of critiquing the particular way the components are used. But rants about hating the js ecosystem or this HN implementation just makes it seem like you’ve had a horrible day at work. OK if that’s the case, we’re sorry. Go out for a run or a drink.

Re: Hacker News Clone Using GraphQL and React

#117
GraphQL is a very nice spec for building APIs that have many sources of data and then building a modern frontend with proper caching etc. on top of it.

The ugliest part of it, or one requiring most hacky solutions, is optimising queries. For example, there are some nasty N+1 traps or "oops-I-joined-your-entire-database" problems when using SQL.

JoinMonster helps with this, but it is a bit too much of a "full solution" or framework to just quickly use. You'll also lose a lot of control over your queries which was a big reason for me to move from Django/Rails/etc. style tools to trying out GraphQL.

This project seems to avoid databases entirely and it seems to have an N+1 queries problem when fetching comments. Each comment is fetched with a separate API call and a single HN Post can easily have hundreds of comments... even if cached, this is a problem.

The SQL "WHERE IN (list of IDs)" query combined with smart caching and batching (see: Dataloader by Facebook, JoinMonster) is a decent solution but requires some amount of good old manual work.

tldr; GraphQL is nice but has its own set of problems. Still no magic bullets.

Re: Hacker News Clone Using GraphQL and React

#119

I feel a little mixed about projects like this. It's fantastic to see people share their knowledge, and turn theory into practice. It's very easy to spout on about best practices and good ideas without demonstrating how they can be implemented in the real world. And this application does demonstrate some good ideas. ...But some bad ideas also. I think one problem we have in the frontend world is that developers of ve…

I think people who are going to avoid the critical thinking of technology choices aren't going to be impacted by examples like this.

Re: Hacker News Clone Using GraphQL and React

#120

I feel a little mixed about projects like this. It's fantastic to see people share their knowledge, and turn theory into practice. It's very easy to spout on about best practices and good ideas without demonstrating how they can be implemented in the real world. And this application does demonstrate some good ideas. ...But some bad ideas also. I think one problem we have in the frontend world is that developers of ve…

This is exactly what I feel. I get heavy request to build projects in React where their use case is pretty simple even wordpress can suffice.

Unless you're using a pre-made template I don't see how a WordPress installation is any simpler than an SSR React site.
Post reply on HN