The proliferation of libraries that exist only to fix the problems introduced by making everything an SPA is hilarious. Everything in web tech from the last decade is basically “there was an old lady who swallowed a fly”*.
I do think everything has its place. For example, you can do offline PWA with SPA since a page load doesn’t need a call to the server for rendering it. It also saves processing time/bandwidth by offloading the server from the burden of rendering the page. Once the page has loaded, the web app only needs data, not markup nor style. And last is that it is great since it only requires a browser without needing to write native apps in myriad of languages. Distributing and installing it is also not limited by the Apple/Google tax.
For clouds, there are certain workflows that can surely benefit from it. Maintaining your own infrastructure 24/7 with minimal downtime can be overwhelming for SMALL teams, especially one man show. Even more so when the product/web apps suddenly blows in popularity and now need to scale. Even more so when it is being DDoSed. The point is, many things can go wrong. And when you are deploying it for 24/7 use, down times can be costly. Deploying to cloud early and then slowly building towards on-premise after the team gets bigger is a viable route IMHO
And last is container devops. I think it also solves a lot of problems in multi-tenancy or even when running multiple services. Not everyone will use the latest-and-greatest version of a shared library. If the library is somehow conflicting with other tenants/service, you will have a bad time. Also, developing inside a container or virtual env can make testing and messing around safer since you didn’t affect your system installation.
For example, you can do offline PWA with SPA since a page load doesn’t need a call to the server for rendering it.
Client still needs to call the server. How offline PWAs work then? They emulate server in ServiceWorkers.
It also saves processing time/bandwidth by offloading the server from the burden of rendering the page.
Let’s call it page generation to not confuse with actual rendering.
It not always saves bandwidth and processing time, but static resources can allow to hide CDN latency on initial load. Although it is not property of SPAs, just separation of static and dynamyc part and generating dynamic part after static page already shows something.
It will still result in more requests, but may trasfer less data per request. May.
Once the page has loaded, the web app only needs data, not markup nor style.
Static web page after loading will not request more styles. SPAs imply client-side dynamic page, and they may request more data INCLUDING styles. Also client still need to load styles on page load.
And last is that it is great since it only requires a browser without needing to write native apps in myriad of languages.
Write for QT.
And when you are deploying it for 24/7 use, down times can be costly. Deploying to cloud early and then slowly building towards on-premise after the team gets bigger is a viable route IMHO
I guess so. Not everything can be offline-oriented.
Client still needs to call the server. How offline PWAs work then? They emulate server in ServiceWorkers.
Yes they do need server for initial resource loading. Usually with PWA, you need to fetch the static resource once from a CDN since every resource is bundled. And no, they don’t need to emulate server in service worker, wtf. You can if you want, but you can also store the data locally using indexeddb and sync periodically baked into the app. Service worker doesn’t emulate server, they just intercept a network call and check their cache. A man in the middle if you will. I think it is debatable if that is called emulating a server or not.
Let’s call it page generation to not confuse with actual rendering.
Yeah, that is fair. Its just the usual web tech shenanigans.
It not always saves bandwidth and processing time, but static resources can allow to hide CDN latency on initial load. Although it is not property of SPAs, just separation of static and dynamic part and generating dynamic part after static page already shows something.
When developing an application, you usually didn’t develop the dynamic and static part separately. Which data can be cached and which needs to be sent to the origin so it can be properly generated. If you fail to configure it correctly the static resource which should go to a CDN get sent to your origin instead. With SPA you just ship the frontend to the cdn and make the backend separately.
It will still result in more requests, but may trasfer less data per request. May.
I mean, if you are making an SPA without splitting the bundle, there should only be a single html, css, and js. A bunch of images and some font too if you want to be complete. But if you are making the page server generated, you always need to transmit the HTML. ALWAYS. So I think it definitely saves requests.
Static web page after loading will not request more styles. SPAs imply client-side dynamic page, and they may request more data INCLUDING styles. Also client still need to load styles on page load.
SPA will not request more style if you are bundling them tho? Wtf are you talking about? Unless you explicitly split the style, once SPA is loaded every page navigation is just JavaScript replacing the whole HTML with the one bundled in the JS file.
Write for QT.
Sure, QT exist as a UI library for cross platform. But that doesn’t solve the iOS mafia. We only got Apple to allow 3rd party store now, we haven’t got sideloading yet. It is a hassle if you want to make an app that can be used in any devices. Especially if the app is just some form filling app.
These are completely different types of skills. Front end is complex because there’s an explosion of different states driven by how the user interacts with the UI. On the other hand, backend workflows tend to be a lot more structured. You get a request, do some processing, fetch some data, and return a response.
Making good UX is fucking hard. I say UX because making it good is really about the user’s experience, not graphic design. An ugly front end can be good if it’s intuitive and easy to use. But a visually gorgeous front end will still be garbage if it’s clunky and confusing.
It’s really something you have to experience to fully understand. Ultimately it comes down to this: front ends have to deal with people, backends only have to deal with computers. So backends can be cleanly organized and well structured. Applying backend design principles to a front end will get you a CRUD interface - something that’s usable but no one really wants to use.
You need to be able to do layout design to do good ux. The visual presentation is a critical aspect of usability. Also backend code needs to be consumable future readers (including the author). That’s something that is very often lost and you get terrible unorganized backed code.
This is kind of what I meant. Appearance isn’t just colours and alignment, but also things like flow, organisation and layout. I can make the data theoretically accessible, but with all that stuff I’m completely out of my depth.
Write-only code can be an issue for either, while on the other hand complexity theory, big data structures and high math make me think backend.
The complexity of dealing with different states a UI can be in. The user can navigate the interface of an app in many different ways. The US has to be able to handle all the different combinations of actions the users takes. This means maintaining a consistent state, loading data that’s needed, keeping track of navigation, etc. The logic in an interface of an app like an email client is far more complex than most backend workflows.
Yeah, that could be reasonably complex I guess. I’ve never dealt with more than one navigation structure in a UI, like that would have. All the memes are about clients wanting it to look different.
I mean… the browser can do all that shit itself, just give it some HTML and stylesheets. It’s incredibly important to realize that nearly all this complexity is optional - it may make sense for Facebook to invest this much in a UI but most companies could get away with plain ol’ html with a bit of styling.
As a front end developer you should know when things like infinite loading dynamic tables with a search bar add significant value and when <table> is good enough. Maintaining complex systems costs money and developers should always advocate for the simplest most sustainable solution to a problem. I think we have a real issue with pursuing shiny new technologies.
I mean… the database does all the shit itself, just give it some SQL queries. It’s incredibly important to realize that nearly all this complexity is optional - it may make sense for Facebook to invest this much in their backend infrastructure but most companies could get away with plain ol’ script that on top of Postgres.
As a backend developer you should know when things like load balancing and and complex db schemas add little value, a single table is good enough. Maintaining complex systems costs money and developers should always advocate for the simplest most sustainable solution to a problem. I think we have a real issue with pursuing shiny new technologies.
A simple web app will be okay with some HTML forms, sure. But something like a multi step wizard will lead you down the path of storing a huge amount of state on the server side, which turns into a mess. We have a wizard that uses Django’s forms and django-formtools’s wizard. You have to put the state and complexity somewhere. We put it in the backend and I can’t say I like how it turned out. The code is spaghetti and we get a stream of errors from people not acting how they’re expected to act.
As a backend person, lol no. I mean I can make a thing that works, but it will require eye bleach afterwards, and I’ll hate every moment of building it.
I remember the day of php files outputting html to the browser… it was 95% as functional as the stuff written in react and node today and incredibly simple.
Heck, at my company, I still sneak in old-school HTML files when I can.
I am starting to come around if not to the horrible solutions then at least the shift in thinking that made people consider using those, over the old-school approach.
Back then, the internet was this cool new thing. Fast-forward to today, and all those old pages with broken links, outdated information, and outdated presentation of information, can be problematic. e.g., should a site show an email address, or a phone number, or will doing so allow it to be spammed by bots? (except: that will happen anyway, no matter what, and why prevent people who have legitimate needs to find information?)
Back then, people had actual attention spans, and finding new information was cool, so when people saw it, they gobbled it up and relished the chance to do so. Fast-forward to today though, and there is so much more information (& unfortunately misinformation, plus active disinformation too) than could ever hope to be read, much less absorbed and/or retained, that the default is to skim or skip rather than actually “read”, e.g. a ToS/ToC that is mandatory to continue with a service that you use literally daily.
So, I am not advocating for e.g. CSS, or React/Angular, etc., but I at least see why people were considering those options, b/c there were problems with the old approach too.
I would not be so sure. Maybe for a static web page this is possible. Outside of that I think people are kidding themselves. Writing code that might be stateless in isolation but relies on a database isn’t a stateless server imo, it’s just outsourcing state to another service.
With the SPA approach, you can have remarkably little state on the server because all the state associated with the user session lives on the frontend. The value of doing this obviously depends on the type application you’re making, but it can be a sensible approach in some cases.
Doesn’t SPA require polling the web server for more information? I feel like any website which retains information outside of the client device (like anything with a login page) would require state to be stored somewhere on the backend.
What kind of polling are we talking about? If you are talking about realtime data, SSE doesn’t solve that either. You need SSE or WebSocket for that (maybe even WebRTC). If what you mean is that every time the page is refreshed then the data is reloaded, it is no different than polling.
Typically, you just have a session cookie, and that doesn’t even need to be part of the app as auth can be handled by a separate proxy. The server just provides dumb data pull operations to the client in this setup, with all the session state living clientside.
That data has to be stored somewhere though. So you would still need some kind of database server to store it all or some other solution. That’s what I mean by outsourcing state. Data is still stored in the backend, just in a database rather than a web server.
There is data that gets persisted and needs to be stored somewhere, and then there’s the UI state that’s ephemeral. The amount of data that gets persisted tends to be small, and the logic around it is often trivial.
Sure, but that only gets you so far. I think it’s important to distinguish between document sites where the users mostly just views content, and actual applications like an email client or a calendar. The former can be easily handled with little to no frontend code, however the latter tend to need non trivial amount of UI state management.
As a network guy…open up your favorite web-managed application and open the developer console. Inspect the transactions you see and compare it to the applications REST API reference, and you’ll likely find a lot of commonality (and maybe some undocumented endpoints!).
Backend made the API and everything that is performed by it. Front end is doing the GUI based off the response and promoting for input.
Backend code, basically what is ran on the server and manages user requests, database interactions, etc… Frontend is the user end, so managing input, displaying information from server requests, etc. and is in the form of an app or website page.
You are not logged in. However you can subscribe from another Fediverse account, for example Lemmy or Mastodon. To do this, paste the following into the search field of your instance: !programmerhumor@lemmy.ml
Post funny things about programming here! (Or just rant about your favourite programming language.)
Rules:
Posts must be relevant to programming, programmers, or computer science.
No NSFW content.
Jokes must be in good taste. No hate speech, bigotry, etc.
I feel (as a fullstack developer) that letting websites run arbitrary code in your browser was a mistake.
The proliferation of libraries that exist only to fix the problems introduced by making everything an SPA is hilarious. Everything in web tech from the last decade is basically “there was an old lady who swallowed a fly”*.
*see also Cloud and container DevOps
I do think everything has its place. For example, you can do offline PWA with SPA since a page load doesn’t need a call to the server for rendering it. It also saves processing time/bandwidth by offloading the server from the burden of rendering the page. Once the page has loaded, the web app only needs data, not markup nor style. And last is that it is great since it only requires a browser without needing to write native apps in myriad of languages. Distributing and installing it is also not limited by the Apple/Google tax.
For clouds, there are certain workflows that can surely benefit from it. Maintaining your own infrastructure 24/7 with minimal downtime can be overwhelming for SMALL teams, especially one man show. Even more so when the product/web apps suddenly blows in popularity and now need to scale. Even more so when it is being DDoSed. The point is, many things can go wrong. And when you are deploying it for 24/7 use, down times can be costly. Deploying to cloud early and then slowly building towards on-premise after the team gets bigger is a viable route IMHO
And last is container devops. I think it also solves a lot of problems in multi-tenancy or even when running multiple services. Not everyone will use the latest-and-greatest version of a shared library. If the library is somehow conflicting with other tenants/service, you will have a bad time. Also, developing inside a container or virtual env can make testing and messing around safer since you didn’t affect your system installation.
Client still needs to call the server. How offline PWAs work then? They emulate server in ServiceWorkers.
Static web page after loading will not request more styles. SPAs imply client-side dynamic page, and they may request more data INCLUDING styles. Also client still need to load styles on page load.
Write for QT.I guess so. Not everything can be offline-oriented.
Yes they do need server for initial resource loading. Usually with PWA, you need to fetch the static resource once from a CDN since every resource is bundled. And no, they don’t need to emulate server in service worker, wtf. You can if you want, but you can also store the data locally using indexeddb and sync periodically baked into the app. Service worker doesn’t emulate server, they just intercept a network call and check their cache. A man in the middle if you will. I think it is debatable if that is called emulating a server or not.
Yeah, that is fair. Its just the usual web tech shenanigans.
When developing an application, you usually didn’t develop the dynamic and static part separately. Which data can be cached and which needs to be sent to the origin so it can be properly generated. If you fail to configure it correctly the static resource which should go to a CDN get sent to your origin instead. With SPA you just ship the frontend to the cdn and make the backend separately.
I mean, if you are making an SPA without splitting the bundle, there should only be a single html, css, and js. A bunch of images and some font too if you want to be complete. But if you are making the page server generated, you always need to transmit the HTML. ALWAYS. So I think it definitely saves requests.
SPA will not request more style if you are bundling them tho? Wtf are you talking about? Unless you explicitly split the style, once SPA is loaded every page navigation is just JavaScript replacing the whole HTML with the one bundled in the JS file.
Write for QT.Sure, QT exist as a UI library for cross platform. But that doesn’t solve the iOS mafia. We only got Apple to allow 3rd party store now, we haven’t got sideloading yet. It is a hassle if you want to make an app that can be used in any devices. Especially if the app is just some form filling app.
Lol. I fucking hate websites that take up half the page with a navbar.
Or a page that uses only half the screen width in the center. Just use the damn screen!
Yes! Let the user resize the window if they want it take up half their screen!
That goose should be made mandatory in all customer meetings.
Я гусь и я до тебя доебусь
É você que financia essa merda!
If that were true, you’d have more front end devs being able to do backend instead of the other way around.
These are completely different types of skills. Front end is complex because there’s an explosion of different states driven by how the user interacts with the UI. On the other hand, backend workflows tend to be a lot more structured. You get a request, do some processing, fetch some data, and return a response.
From where I sit, it seems like frontend is closer to being a graphic designer than on backend.
Then you haven’t developed a non-trivial user interface before.
I’ve made UIs, and at least one I’d say was complex, but it was also really ugly. What am I missing?
This wasn’t a put-down, BTW. I couldn’t be a graphic designer either.
Making good UX is fucking hard. I say UX because making it good is really about the user’s experience, not graphic design. An ugly front end can be good if it’s intuitive and easy to use. But a visually gorgeous front end will still be garbage if it’s clunky and confusing.
It’s really something you have to experience to fully understand. Ultimately it comes down to this: front ends have to deal with people, backends only have to deal with computers. So backends can be cleanly organized and well structured. Applying backend design principles to a front end will get you a CRUD interface - something that’s usable but no one really wants to use.
You need to be able to do layout design to do good ux. The visual presentation is a critical aspect of usability. Also backend code needs to be consumable future readers (including the author). That’s something that is very often lost and you get terrible unorganized backed code.
This is kind of what I meant. Appearance isn’t just colours and alignment, but also things like flow, organisation and layout. I can make the data theoretically accessible, but with all that stuff I’m completely out of my depth.
Write-only code can be an issue for either, while on the other hand complexity theory, big data structures and high math make me think backend.
How about UIs that are essentially web apps. I’m talking about needing to handle drag and drop, graphs and the like.
There is also the mess that is responsive design, multi browser support and proper accessibility.
The complexity of dealing with different states a UI can be in. The user can navigate the interface of an app in many different ways. The US has to be able to handle all the different combinations of actions the users takes. This means maintaining a consistent state, loading data that’s needed, keeping track of navigation, etc. The logic in an interface of an app like an email client is far more complex than most backend workflows.
Yeah, that could be reasonably complex I guess. I’ve never dealt with more than one navigation structure in a UI, like that would have. All the memes are about clients wanting it to look different.
I mean… the browser can do all that shit itself, just give it some HTML and stylesheets. It’s incredibly important to realize that nearly all this complexity is optional - it may make sense for Facebook to invest this much in a UI but most companies could get away with plain ol’ html with a bit of styling.
As a front end developer you should know when things like infinite loading dynamic tables with a search bar add significant value and when
<table>is good enough. Maintaining complex systems costs money and developers should always advocate for the simplest most sustainable solution to a problem. I think we have a real issue with pursuing shiny new technologies.I mean… the database does all the shit itself, just give it some SQL queries. It’s incredibly important to realize that nearly all this complexity is optional - it may make sense for Facebook to invest this much in their backend infrastructure but most companies could get away with plain ol’ script that on top of Postgres.
As a backend developer you should know when things like load balancing and and complex db schemas add little value, a single table is good enough. Maintaining complex systems costs money and developers should always advocate for the simplest most sustainable solution to a problem. I think we have a real issue with pursuing shiny new technologies.
A simple web app will be okay with some HTML forms, sure. But something like a multi step wizard will lead you down the path of storing a huge amount of state on the server side, which turns into a mess. We have a wizard that uses Django’s forms and django-formtools’s wizard. You have to put the state and complexity somewhere. We put it in the backend and I can’t say I like how it turned out. The code is spaghetti and we get a stream of errors from people not acting how they’re expected to act.
Backend devs can do frontend?
As a backend person, lol no. I mean I can make a thing that works, but it will require eye bleach afterwards, and I’ll hate every moment of building it.
Yes. It’ll look like a Geocities page, but yes.
Pah, as if Geocities had the good taste to use courier new.
Also, more seriously, if all the client needs is a geocities page is it reasonable for a front end developer to build it in react?
yes, according to every project manager i’ve worked with.
here i wrote you a frontend
And yet it still works better than a MB of JS
How are you managing the state?
Join the dark side. We have cookies.
They think they can.
https://imgur.com/a/wOgZwpn
Not all, but more than front enders being able to do backend is my point.
Than*
Not me!
I didn’t read the community name and wondered who tf thought the back end of a goose requires more attention than the front end
Well…depends on what the vertical distance is I’d wager…
Devs, fight!
😄
Try writing your backend with browser limitations and see what kind of wild wrappers you make to keep yourself sane.
What are limitations of browser for backend?
I remember the day of php files outputting html to the browser… it was 95% as functional as the stuff written in react and node today and incredibly simple.
Heck, at my company, I still sneak in old-school HTML files when I can.
I am starting to come around if not to the horrible solutions then at least the shift in thinking that made people consider using those, over the old-school approach.
Back then, the internet was this cool new thing. Fast-forward to today, and all those old pages with broken links, outdated information, and outdated presentation of information, can be problematic. e.g., should a site show an email address, or a phone number, or will doing so allow it to be spammed by bots? (except: that will happen anyway, no matter what, and why prevent people who have legitimate needs to find information?)
Back then, people had actual attention spans, and finding new information was cool, so when people saw it, they gobbled it up and relished the chance to do so. Fast-forward to today though, and there is so much more information (& unfortunately misinformation, plus active disinformation too) than could ever hope to be read, much less absorbed and/or retained, that the default is to skim or skip rather than actually “read”, e.g. a ToS/ToC that is mandatory to continue with a service that you use literally daily.
So, I am not advocating for e.g. CSS, or React/Angular, etc., but I at least see why people were considering those options, b/c there were problems with the old approach too.
ServiceWorkers?
You mean NodeJS lol
You can write a stateless server. You can’t do stateless front-end since you have to deal with user interaction.
I would not be so sure. Maybe for a static web page this is possible. Outside of that I think people are kidding themselves. Writing code that might be stateless in isolation but relies on a database isn’t a stateless server imo, it’s just outsourcing state to another service.
With the SPA approach, you can have remarkably little state on the server because all the state associated with the user session lives on the frontend. The value of doing this obviously depends on the type application you’re making, but it can be a sensible approach in some cases.
Doesn’t SPA require polling the web server for more information? I feel like any website which retains information outside of the client device (like anything with a login page) would require state to be stored somewhere on the backend.
What kind of polling are we talking about? If you are talking about realtime data, SSE doesn’t solve that either. You need SSE or WebSocket for that (maybe even WebRTC). If what you mean is that every time the page is refreshed then the data is reloaded, it is no different than polling.
Typically, you just have a session cookie, and that doesn’t even need to be part of the app as auth can be handled by a separate proxy. The server just provides dumb data pull operations to the client in this setup, with all the session state living clientside.
That data has to be stored somewhere though. So you would still need some kind of database server to store it all or some other solution. That’s what I mean by outsourcing state. Data is still stored in the backend, just in a database rather than a web server.
There is data that gets persisted and needs to be stored somewhere, and then there’s the UI state that’s ephemeral. The amount of data that gets persisted tends to be small, and the logic around it is often trivial.
So I was right then. Colour me surprised.
In many pages application url already bears part of state.
Sure, but that only gets you so far. I think it’s important to distinguish between document sites where the users mostly just views content, and actual applications like an email client or a calendar. The former can be easily handled with little to no frontend code, however the latter tend to need non trivial amount of UI state management.
As an infra guy… What’s backend in this context?
As a network guy…open up your favorite web-managed application and open the developer console. Inspect the transactions you see and compare it to the applications REST API reference, and you’ll likely find a lot of commonality (and maybe some undocumented endpoints!).
Backend made the API and everything that is performed by it. Front end is doing the GUI based off the response and promoting for input.
Backend code, basically what is ran on the server and manages user requests, database interactions, etc… Frontend is the user end, so managing input, displaying information from server requests, etc. and is in the form of an app or website page.
Hah. I get it. Good one.
Frontend devs are the perps and victims at the same time.
Anti Commercial-AI license