I was also a bit disappointed to find basic arithmetic. There is more. I was expecting something like an algorithm for a tile layout like https://masonry.desandro.com/ or https://github.com/d3/d3-hierarchy#treemap. In terms of animations, understanding linear algebra can help you take full advantage of CSS matrix and matrix3d transforms. Certain parallax effects can be done done better with trigonometry...
When you're implementing a user interface, you typically have some "design" or model of how it should work in your head. The main challenge is translating this intuitive model into a formal model that the computer can interpret for you. Math can definitely help you with this!
I think we should be emphasizing mathematical knowledge in front-end design and implementation, not trying to hide it under the covers. The better you are at math, the easier it is for you to implement the correct system for the design you want, and the less you have to compromise the design to fit the systems you have at hand.
How would one express those constraints? I think it's more efficient to let a human designer figure out some approximation of decent design and usability.
The way it's done in 2D sketch programs such as the sketch feature of Fusion 360 or Autodesk Inventor. Graphically. I've discussed this before on HN. All the modern CAD systems do this.
It took decades to get CAD GUIs right, but now they're quite good. They solve a far harder problem than web design. Look to them for guidance.
Tantek Çelik did some of this experimentation, amazingly, over a decade ago (2001). Right-click for his CSS:
"A Study of Regular Polygons" http://tantek.com/CSS/Examples/polygons.html
Off topic, but are there any accessible resources to learn:
1. How fonts get rendered? What happens when I present browser with a font file and some utf-8 bytes, how does it convert this into viewable text.
2. Once browser creates DOM and CSSOM how does it use this information to create the view that I see?
Hey nice resource but this is more of a tutorial on how to optimize font loading etc...
>The browser performs layout and paints content to the screen.
This is the step I want to understand more thoroughly..
Game developers have to know far more math than web developers. Basic game developers need to know trig and matrix math cold. Advanced game developers need differential equations for physics engines, some topology for mesh handing, and AI for NPCs.
It selects all tags that generally contain content and sets the font to Verdana, with a font size of 16px. Whenever I get to such a site, I just click the bookmark and it's readable.
Readit News
(Front end design ought to have more math behind the scenes, like a constraint solver, and less arithmetic visible to the web designer.)
I think we should be emphasizing mathematical knowledge in front-end design and implementation, not trying to hide it under the covers. The better you are at math, the easier it is for you to implement the correct system for the design you want, and the less you have to compromise the design to fit the systems you have at hand.
At least, the dot graph layout language uses integer programming to lay out it's graphs.
It took decades to get CAD GUIs right, but now they're quite good. They solve a far harder problem than web design. Look to them for guidance.
2. Once browser creates DOM and CSSOM how does it use this information to create the view that I see?
https://developers.google.com/web/fundamentals/performance/o...
Deleted Comment
Deleted Comment