24
loading...
Day 4 of #100daysofcode: CSS and Client vs. Server
My free time on Tuesdays is usually incredibly low, so this update (along with future Tuesday updates) will be fairly short.
To quickly preface the below, the part of the project in question simply displays a "time until" a given date and time.
I've been thinking about where to handle some computation. I have been back and forth on whether to use client or to use server. The calculation for this project is very simple; just turning a date string into a different format before displaying it to the user. No problem to let the client deal with this, right?
My question arises though because this computation is done in two instances right now. The first is when the user loads the page, a list of these times appear, and all of them are calculated by the client. The second instance is when the user saves a new event, the client immediately turns around and calculates this time remaining and displays it to the user as well.
In both instances, the client is receiving data from the server and then modifying it before displaying it. It feels wasteful, perhaps it would be better handled by the server before the data is sent? Is that still the case when saving a new event? Because in that case, you have to send an event to the server and then receive it back from the server before displaying it. Surely then it would be better off handling it on client side instead of getting a new request.
There is a benefit to requesting from the server on save however, as we can use that to refresh the times of all the other events on screen.
Is the best answer just to preprocess data before its sent up to the client, but when saving a new event the client then handles calculating that time until?
In reality, the scope of this problem is small enough such that it probably doesn't matter, but its interesting to think about how problems like this scale.
Today I practiced with CSS flex-boxes and grids. I also spent quite a bit of time checking out some other CSS resources, such as Tailwind, Material UI and Animista. I'm not sure if I plan on using any of their stuff at the time, but its cool to see what else is available.
Tomorrow I will be finally getting around to polishing the layout of my project. After playing around with flex-box and grid, I'm pretty confident I will be able to get to an approximation of what I want the project's layout to look like. Now I just need to draw out what I want it to look like..
Today I got a look at a friends site that he created as a part of a project for a different class. As they say, comparison is the thief of joy and I have to say that I'm a little awestruck at the progress he's made. Thumbing through his site, I had trouble even seeing how some of the parts would fit together. I think that's probably where a lot of my struggle comes from. It doesn't seem intuitive how some elements fit together. CSS has a much more driving role on layout than I initially realized. CSS isn't just style, its the layout its the feel. I thought most of that would be handled in React, but it seems like more and more things I'm learning about is getting lifted out of React and back onto CSS's shoulders.
Back to the books.
Thanks for reading! As usual, if you have any suggestions, I'd love to hear them.
24