News for hackers. Stuff that matters.
Re:Mechanical Watch by ThePhysicist on Wednesday May 04, 2022 @12:31PM (#31262720)
I was curious how he did those visualizations so I looked at the source code. Turns out he codes everything by hand in WebGL [1]. Absolutely impressive stuff. Source code is non-minified so you can have a look and understand everything as well.

[1]: https://ciechanow.ski/js/watch.js

Re:Mechanical Watch by rsp1984 on Thursday May 05, 2022 @06:28AM (#31271598)
I'm observing that developers these days are quite surprised to see anyone write code for OpenGL / WebGL directly instead of using some layer of abstraction on top, such as Three.js or Unity etc. Few seem to know that OpenGL already is an abstraction of the computing model underneath.

A couple years ago I did some consulting for a company that needed a point cloud rendering engine. Luckily I had one ready to go. I showed them and they liked it and their young devs asked which library I was using. When I told them I used OpenGL they couldn't believe it. To them OpenGL was the "black magic box" and using it akin to having secret conversations with the GPU in some arcane cryptic language.

Re:Mechanical Watch by dreamcompiler on Saturday May 07, 2022 @10:45AM (#31294902)
I wrote interactive 3D graphics programs in SGI IrisGL, the proprietary predecessor of OpenGL. At that time I considered it super easy because it was so high-level. Even so, as an experiment, I networked an Iris to a Lisp machine so I could write graphics code in Lisp and let the SGI machine render the output. Good times.

History tidbit: Jim Clark, the founder of SGI, invented the GPU which was what made SGI machines so fast at 3D.. Later he went on to found Netscape.

https://en.m.wikipedia.org/wiki/James_H._Clark

Re:Mechanical Watch by no-s on Saturday May 07, 2022 @11:04AM (#31295081)
> History tidbit: Jim Clark, the founder of SGI, invented the GPU which was what made SGI machines so fast at 3D.

Even more trivial: When I moved to Silicon Valley I bought a used Porsche on a whim (my recruiter implied it was a proper consultant accessory in SV) and fixed it up a bit until it became my daily driver. When I researched the title I discovered Jim Clark was the original owner. So I’d like to credit Jim Clark for starting me on the road to speed up my commute.

Re:Mechanical Watch by daniel-cussen on Wednesday May 11, 2022 @07:28PM (#31347321)
Did he soup it up? If not, nobody cares who owned it before.
Re:Mechanical Watch by jovial_cavalier on Monday May 16, 2022 @08:18PM (#31404587)
I'm sure people hang on your words with bated breath
Re:Mechanical Watch by TranquilMarmot on Friday May 06, 2022 @12:59AM (#31281484)
When I was in college, I got really deep into OpenGL and worked through old textbooks about OpenGL 1.1. I think my favorite one was just called "The Red Book"? It was so much fun.

After finishing that I found out that they were already several major versions ahead and had fancy things like shaders... it really is an amazing tool.

Recently I started messing with some Three.js stuff and it does have some nice abstractions... main benefit of it for me is the ecosystem around it. Being able to just plug in some physics and interactivity and not have to deal with digging up old screen-to-world conversion code is nice.

Re:Mechanical Watch by bori5 on Thursday May 05, 2022 @08:43AM (#31272611)
In my waking up state I read that as “some layer of distraction”. How fitting ;) But back to original post , yes his work and website is amazing.
Re:Mechanical Watch by jachee on Thursday May 05, 2022 @06:17PM (#31278983)
When it’s time to simplify and/or troubleshoot overly-complex things, I like to use the phrase “The abstraction is a distraction”.
Re:Mechanical Watch by notjustanymike on Wednesday May 04, 2022 @09:54PM (#31268444)
Fun fact, the time and date on the model is correct as well.
Re:Mechanical Watch by panzerboiler on Wednesday May 04, 2022 @12:44PM (#31262858)
He does it "the right way™". Use the platform. Don't use any framework or generic library. Go straight to the point and code what you need, when you need it. Don't minify or bundle anything, and let the people who are learning and courious a straightforward way to connect the dots, without forcing them into a github repository with 90% of the code unrelated to the thing and existing just to glue 1000 pieces written by 10000 people together. Every essay by Bartosz is so top-notch and a such breath of fresh air! He gives me hope in humanity and I am immensely grateful for what he does.
Re:Mechanical Watch by valtism on Wednesday May 04, 2022 @06:38PM (#31266785)
I strongly disagree that this is "the right way". I think that the platform provides low level primitives that are _designed_ to have abstractions built upon them.

Doing it like this has the potential to be the most performant, but it does so in the same way as writing your programs directly in assembly is potentially performant.

I also don't think that the source code is particularly readable for me, and contains lots of magic numbers and very imperative code. I would personally find it a lot more readable if it was written in some sort of declarative way using a library, even if I have to look at a GitHub repo instead of view source.

Re:Mechanical Watch by ranit on Wednesday May 04, 2022 @09:38PM (#31268322)
> but it does so in the same way as writing your programs directly in assembly

> contains lots of magic numbers and very imperative code

Well, we really don't know if the code was written in this form by hand, don't we.

It could have been compiled into this, to use your words, "assembly with magic numbers and imperative" from much more elegant form. We may see this form only because this is what browsers understand.

I am not saying it was compiled, just speculating that seeing pure WebGL does not mean it was pure WebGL to begin with.

Re:Mechanical Watch by aiisjustanif on Thursday May 05, 2022 @10:53AM (#31274132)
Re:Mechanical Watch by tomc1985 on Thursday May 05, 2022 @12:01PM (#31275054)
Graphics code tends to be imperative and have lots of magic numbers. I suppose it's the math-intensive nature of it.

Personally I'm not a fan of the magic numbers either but as I study more and more of it, it's everywhere

Re:Mechanical Watch by bayindirh on Friday May 06, 2022 @11:50AM (#31286589)
When there's physics, graphics and mathematics, there are magic numbers, which are results of formulas which needs to be computed once, or material properties, or nature's constants.

Also, nature and graphics works as an imperative parallel machine. So the code mirrors that.

This is not written deliberately this way. Code comes out like that when you strip all the libraries, fluff, and other less-related stuff.

I also write a scientific application, and yes, This is the way.

Re:Mechanical Watch by the_cat_kittles on Wednesday May 04, 2022 @09:34PM (#31268296)
it depends if you are doing something to get paid, or to last, or to be really good. only in the first case do i ever consider a heap of abstractions
Re:Mechanical Watch by kaba0 on Thursday May 05, 2022 @05:42AM (#31271361)
Abstraction is the only thing that makes any of our advancements possible. Not even the simplest of math theses could be proves without a “framework” of relevant lemmas, nor could you write even a single hello world without the layers upon layers of abstractions written carefully over the decades. Sure, there is also bad abstraction, but the problem is the bad part, not the concept itself.

Without abstractions you wouldn’t be able to read a text stored on a remote computer with accompanying style information displayed the same on both of our devices and with embedded 3D graphics doing the same thing on vastly differing devices be it a top of the line GPU or a simple low-end phone. Is it not abstraction?

Re:Mechanical Watch by jseban on Thursday May 05, 2022 @05:53AM (#31271418)
Well, if the abstractions were peer reviewed and put through the same rigour as mathematical proofs, that's a whole different topic.

The equivalent would be a mathematical services company, who created "free" abstraction packages that required you to rewrite all your math, away from the scientific community standards, to fit their abstractions, and who also made money on consulting and selling books. And the big benefit of it all, is really that they only abstracted away writing summaries of your papers, which is actually the easiest part that is quite irrelevant to your research.

Re:Mechanical Watch by kaba0 on Thursday May 05, 2022 @06:59AM (#31271791)
But it is not math - we only have empirical evidence and not even much from that.

Who is to tell whether the OSI model is ideal? It is more than likely not it, but we can’t measure these things up front, there is an insane cost associated with changing it, etc. Yet again, what is the alternative? We can’t manage complexity any other way, and essential complexity can’t be reduced.

Re:Mechanical Watch by the_only_law on Thursday May 05, 2022 @02:28PM (#31276883)
> Who is to tell whether the OSI model is ideal?

The current idea of the OSI model was also retrofitted from what it originally was.

Re:Mechanical Watch by mr_gibbins on Friday May 06, 2022 @06:54PM (#31290382)
Ooo, you're giving me LaTeX vibes!
Re:Mechanical Watch by the_cat_kittles on Thursday May 05, 2022 @11:50AM (#31274892)
i mostly mean the heap of stuff people often throw at problems. of course you cant do anything without abstractions. it helps to understand them better though.
Re:Mechanical Watch by noitpmeder on Thursday May 05, 2022 @04:45AM (#31271050)
This is so backwards.
Re:Mechanical Watch by the_cat_kittles on Thursday May 05, 2022 @11:51AM (#31274918)
it really depends on what your doing mate!
Re:Mechanical Watch by swayvil on Wednesday May 04, 2022 @07:36PM (#31267301)
On a scale of 1 to 10 how strongly are we talking here?
Re:Mechanical Watch by plebianRube on Wednesday May 04, 2022 @07:45PM (#31267400)
9.5 Your PR will be held up for at least a month with the back and forth.
Re:Mechanical Watch by jseban on Thursday May 05, 2022 @06:12AM (#31271516)
> has the potential to be the most performant

It also has the potential to evolve in the most efficient way.

Re:Mechanical Watch by 10000truths on Wednesday May 04, 2022 @12:55PM (#31262991)
I mostly agree with you, but I don’t mind minification when appropriate, as it can serve a functional purpose with tangible end-user-friendly benefits (less downloaded over the network = faster response times).

But if you want to be friendly to the tinkerers, you could always host both the *.js and *.min.js versions, and have the webpage just pull the latter - anyone who wants the unminified source can remove the “min” part from the URI, while the majority of end users will still benefit from pulling the minified js.

Re:Mechanical Watch by throwaway2214 on Wednesday May 04, 2022 @05:00PM (#31265803)
minified js is not greatly smaller than gzipped js, I think the whole minification thing is a swing and a miss and now we have to deal with source maps and shit, and build pipelines and etc

    $ ls -la
    -rw-r--r-- 1 jack 197609 330905 May  4 22:56 watch.js
    -rw-r--r-- 1 jack 197609 152172 May  4 22:55 watch.min.js

    $ gzip watch.js
    $ gzip watch.min.js
    $ ls -la
    -rw-r--r-- 1 jack 197609 43690 May  4 22:56 watch.js.gz
    -rw-r--r-- 1 jack 197609 32507 May  4 22:55 watch.min.js.gz
Re:Mechanical Watch by MrDOS on Wednesday May 04, 2022 @08:18PM (#31267707)
Of surprise to no one, Brotli does better on both:

    $ ls -l *.js
    -rw-r--r--  1 mrd  staff  330904  5 May 01:04 watch.js
    -rw-r--r--  1 mrd  staff  152172  5 May 01:10 watch.min.js
    $ brotli watch.js
    $ brotli watch.min.js
    $ ls -l *.br
    -rw-r--r--  1 mrd  staff  34461  5 May 01:04 watch.js.br
    -rw-r--r--  1 mrd  staff  27122  5 May 01:10 watch.min.js.br
If I were serving this content, and if my web server and all of my target browsers supported Brotli, I'd be somewhat more content to ship an un-minified + Brotli-compressed file than an un-minified + gzip'd one. I'm sure it's some rule of thumb stuck in my head from the Web 2.0 era, but a JavaScript payload in excess of 40KB crosses some warning line in my head. (Probably 40KB / ~4KB/s throughput on a good dial-up connection = 10s transfer time, about the longest you'd want to wait for even a pretty spiffy page to load.)
Re:Mechanical Watch by MrDOS on Thursday May 05, 2022 @11:23AM (#31274525)
> I'd be somewhat more content to ship an un-minified + Brotli-compressed file than an un-minified + gzip'd one.

Whoops, typo: I meant to say that I'd be somewhat more content to ship an un-minified + Brotli-compressed file than a minified + gzip'd one. That is, I'd be more happy to serve the 34.4KB watch.js.br than the 32.5KB watch.min.js.gz.

Re:Mechanical Watch by jseban on Thursday May 05, 2022 @04:37AM (#31271000)
> and now we have to deal with source maps and shit

Yeah minification is only really for obfuscation. The small and unpredictable difference is absolutely not worth the ridiculous complex "solution" of source maps. Just the fact that your debugger really doesn't work right, is a deal breaker in and itself, not to mention all the time spent configuring and fighting with webpack.

I don't think any form of "compilation" i.e. bundling, transpiling, minification etc is needed at all. Javascript can already dynamically load (additional) code files when needed, I don't understand why you need to bundle it in the first place.

I don't buy that the http request overheads are so big that it motivates all this complexity, and in the average case a user don't use every single page of the application anyway, so by bundling everything you are always serving "too much", compared to just dynamically loading additional code.

Re:Mechanical Watch by lifthrasiir on Thursday May 05, 2022 @07:04AM (#31271834)
Gzipped JS is generally much smaller than minified JS, but minified-then-gzipped JS is even more so. The minification (assuming gzip) doesn't make a much difference in this case only because the input file is not that large at all and compression algorithms have a natural bias for larger inputs. You can (rightly) claim it is bad to have a JS file large enough that the minification makes a difference after all, but you'd be moving a goalpost then.
Re:Mechanical Watch by selcuka on Wednesday May 04, 2022 @08:26PM (#31267778)
True, but it also removes the comments and the whitespace, leading to slightly better performance and memory usage. There are also less bytes to gzip on the server side.
Re:Mechanical Watch by Cthulhu_ on Thursday May 05, 2022 @04:20AM (#31270897)
Slightly, but is it enough to warrant the extra steps?

I don't think the difference is significant enough in this case.

That said, I do think there should be an alternative to minification+gzipping, like e.g. a compiled version of JS that is more optimized than a browser's own JIT compiler can do. Mind you, that might up being a larger package than the JS source code.

Re:Mechanical Watch by kaba0 on Thursday May 05, 2022 @05:44AM (#31271366)
Webassembly is* pretty much that

* hopefully will be

Re:Mechanical Watch by kevincox on Wednesday May 04, 2022 @02:12PM (#31263910)
A discoverable version would be to include source maps that link to the original as well. That way a browser console will automatically pull up the original.
Re:Mechanical Watch by klabb3 on Wednesday May 04, 2022 @03:20PM (#31264685)
People measure minification in byte size (unfortunately I guess you're charged by CDNs by that metric too?). In reality everything text based compresses really well over the wire. In either case, importing tons of libs left and right is going to vastly out-size any minification, yet most fe devs are very liberal with dependencies.

Minification strips comments too though, which may be undesirable in many cases.

Re:Mechanical Watch by operator-name on Wednesday May 04, 2022 @01:32PM (#31263462)
That's simply not a very well followed (and thus discoverable) standard. Especially for hand crafted code, minifying functions and variable names only obfuscates what is written and minifying whitespace often only has minimal benifits.

In practice this seems to be a lost cause, and links to alternatively hosted source code is more common. Sadly this makes is simple to introduce subtle, harmful differences between the source and what is hosted.

Re:Mechanical Watch by NoSorryCannot on Wednesday May 04, 2022 @06:25PM (#31266655)
The pattern is extremely common on CDNs that serve JS.
Re:Mechanical Watch by monocasa on Wednesday May 04, 2022 @01:33PM (#31263475)
It's hard to guess that extra assets exist on the server if they aren't being pulled down by the site itself.

Seems better just to have premassaged source available in a repo somewhere, or called out on the page itself for a downloaded archive.

Re:Mechanical Watch by AceJohnny2 on Wednesday May 04, 2022 @06:37PM (#31266775)
> He does it "the right way™". Use the platform. Don't use any framework or generic library.

Hard disagree. "Use What's Right For You™".

Of course there is value in understanding the platform beneath your framework or generic library, but that's just an extension of "understand what you're using and why".

Re:Mechanical Watch by Liron on Wednesday May 04, 2022 @01:24PM (#31263369)
We need a ciechanow.ski explainer for how ciechanow.sky explainers are built
Re:Mechanical Watch by jhallenworld on Wednesday May 04, 2022 @03:03PM (#31264507)
Where are the comments in his code? :-)
Re:Mechanical Watch by WHA8m on Wednesday May 04, 2022 @01:33PM (#31263480)
He made this in the spirit of watch making. Super impressive and interesting website!
Re:Mechanical Watch by Cthulhu_ on Thursday May 05, 2022 @04:18AM (#31270882)
> Don't minify or bundle anything

Yeah in this case it doesn't need to; there's no extraneous or unused code or documentation blocks, and gzip (and comparable) compression is good enough, minification doesn't actually reduce the downloaded code size by that much.

Re:Mechanical Watch by ivanhoe on Friday May 06, 2022 @04:18AM (#31282695)
the obvious downside is that it's a lot of work and takes a lot more time... so it might be "the right way™" for some cases, but it's definitely not a rule of thumb...
Re:Mechanical Watch by phailhaus on Wednesday May 04, 2022 @04:47PM (#31265655)
The tradeoff is that there is basically nobody else that has the expertise or time to do the same thing at a similar level of polish. We're not going to see more Ciechanowski-level posts unless new libraries and frameworks make it more accessible.
Re:Mechanical Watch by Handytinge on Thursday May 05, 2022 @04:27AM (#31270939)
We definitely won't if people are taught that frameworks are the only option and never allowed to just write a full program on their own.
Re:Mechanical Watch by phailhaus on Thursday May 05, 2022 @10:28AM (#31273795)
Nobody stopping you from not using a framework, and yet there is basically nobody else at Ciechanowski's level. It's not going to happen, you can't expect everyone to become a hardcore webgl expert (have you tried?). If we want more cool interactive visualizations, we have to make it easier. Otherwise, we're stuck waiting for those with the time and expertise to pull it off.
Re:Mechanical Watch by javajosh on Wednesday May 04, 2022 @05:03PM (#31265823)
Maybe, maybe not. We should do the experiment, though.
Re:Mechanical Watch by phailhaus on Wednesday May 04, 2022 @06:04PM (#31266456)
What experiment do you mean?
Re:Mechanical Watch by soheil on Wednesday May 04, 2022 @02:09PM (#31263872)
Can you point to what libraries he could have used that would have made it simpler? I doubt anything like would benefit from any type of abstraction that currently exists, unless it was a more interactive application that would incorporate user input etc.
Re:Mechanical Watch by JayStavis on Wednesday May 04, 2022 @03:47PM (#31264930)
Depending on one's skillset, you could use a dcc tool like Blender + three.js to make creation of these visuals and interactions much simpler. Have a look at gltfjsx + react-three-fiber [1] combination, which themselves are abstractions over vanilla three.js.

With that said, the raw webGL approach here is arguably more educational, so goal achieved I think!

[1] https://docs.pmnd.rs/react-three-fiber/getting-started/examp...

Edit: there's actually a 50 LOC watch example with r3f: https://codesandbox.io/s/bouncy-watch-qyz5r

Re:Mechanical Watch by soheil on Thursday May 05, 2022 @01:10AM (#31269737)
Cool example, but all r3f is doing here is just providing the threejs camera, controls and the text with emoji, the watch itself is loaded as a .glb file, where I'd assume most people would be interested in learning about.
Re:Mechanical Watch by JayStavis on Thursday May 05, 2022 @10:13AM (#31273597)
Yeah, I think exporting a scene from blender as glft/glb, and then using these tools to bring your exported 3D file to the web, is one of the more approachable abstractions.

The reason you'd use gltfjsx (which that example doesn't) is to have fine grained controls for every node in the scene graph. In the case of the watch, this would map to having a component for each mesh or gear, which can be controlled with mechanics/physics.

Re:Mechanical Watch by ThePhysicist on Wednesday May 04, 2022 @02:15PM (#31263945)
Three.js maybe, but it doesn't abstract too much away in my opinion, it has a lot of functionality around more complex topics (textures for example), but since he doesn't seem to use those it's probably not worth the hassle.
Re:Mechanical Watch by grishka on Wednesday May 04, 2022 @10:39PM (#31268723)
Are you sure about the by hand part? There's a lot of repetition, it feels like at least some of it must be generated.
Re:Mechanical Watch by grishka on Thursday May 05, 2022 @09:35AM (#31273115)
Re:Mechanical Watch by lelandfe on Thursday May 05, 2022 @09:16PM (#31280115)
You will not catch me writing 9000 lines of code to make a blog post. Extremely impressive stuff.
Re:Mechanical Watch by emmelaich on Thursday May 05, 2022 @12:54AM (#31269626)
Yeah, I'm sure a lot of it is copy/pasted or #included from his other work.
Re:Mechanical Watch by ThePhysicist on Thursday May 05, 2022 @02:55AM (#31270396)
There is repetition but it doesn't look auto-generated to me.
Re:Mechanical Watch by matheusmoreira on Thursday May 05, 2022 @05:45AM (#31271376)
I wish he'd write a post about how he developed these visualizations. How does one even learn how to make something this amazing?
Re:Mechanical Watch by indigochill on Thursday May 05, 2022 @08:06AM (#31272283)
> How does one even learn how to make something this amazing?

I haven't done anything quite this amazing, but I have created other things with minimal upfront knowledge and "the way" is simple: just jump in and give it your best shot with what you already know, identify the most glaring deficiency in what you made, take your best shot at solving that, and repeat that process until you have something cool. You can also use this process to focus what you spend time studying/learning, as you backfill the information you were missing to figure out how to overcome whatever obstacles you encounter.

It does take time, but you know what they say about long journeys and single steps. Sometimes there are no shortcuts and you just have to take a lot of steps.

Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @06:18PM (#31266597)
Why is "codes everything by hand" surprising? Is WebGL a really shitty API or something?
Re:Mechanical Watch by donatj on Wednesday May 04, 2022 @06:20PM (#31266611)
> Is WebGL a really shitty API or something?

Yes. Almost no one uses it directly.

Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @06:52PM (#31266907)
Why not? What's wrong with it?
Re:Mechanical Watch by donatj on Wednesday May 04, 2022 @07:26PM (#31267189)
Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @07:50PM (#31267452)
That looks like a fair bit of boilerplate, and a shitty tutorial with comments that mostly just repeat what the code says, but the API doesn't look unusable.

https://github.com/patriciogonzalezvivo/glslCanvas/blob/mast... has most of that same boilerplate in a less repulsive form. https://github.com/patriciogonzalezvivo/glslCanvas/blob/mast... has other bits.

Re:Mechanical Watch by donatj on Wednesday May 04, 2022 @08:03PM (#31267570)
Honestly I think your examples are both genuinely less comprehendible to someone without a deep understanding of GL going in than my example.

It’s a very bad, non-object oriented API in an object oriented language. It was designed for and by people who know GL in other C like languages, not for people who know JavaScript. It is unlike any other part of the language.

The fact that I have to write a shader myself, as a fricken string like I’m writing SQL over here, just to draw a triangle is absurd. There should at the very least be some sort of provided builder for simple shaders.

Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @08:13PM (#31267658)
Yeah, they probably are, I didn't intend them as tutorials but as a better representation of the actual scutwork necessary to draw a triangle.

Object-oriented languages are not a good way to do 3-D rendering. If you want to write pixel shaders in JS you can totally do that but you will have to run them on the CPU; as it happens I wrote a program last week that works that way: http://canonical.org/~kragen/sw/dev3/trama. If you want to run them on the GPU you need a language that exposes the GPU's capabilities.

In essence your primary complaint is that the GPU instruction set is not object-oriented (and neither is your database). Well, you can design your own GPU, but I've got some bad news for you about Verilog, Chisel, and BlueSpec! And you may find out that the real problem is that solid-state physics isn't object-oriented, so your OO GPU will end up underperforming, like the Burroughs B5000 and the Symbolics 3600 (hopefully not as badly as the Intel iAPX432). You'll probably have more success writing an object-oriented database.

However, I do agree that WebGL is a bad API, because boilerplate is never acceptable.

Re:Mechanical Watch by yiyus on Thursday May 05, 2022 @04:07AM (#31270817)
> you may find out that the real problem is that solid-state physics isn't object-oriented

I am saving this quote for future use. Thank you :)

Re:Mechanical Watch by cycomanic on Thursday May 05, 2022 @07:27AM (#31272010)
Funny, I would argue that the rock on my table is very definitely an object ;)
Re:Mechanical Watch by kragen on Thursday May 05, 2022 @09:19AM (#31272932)
Examine it more closely; you will find that it is a dynamical system composed of sextillions of parts, constantly entering and leaving the rock, and that the boundaries between the rock, the table, and the air are very fuzzy indeed. It isn't even encapsulated, nor are its interactions with its environment mediated by messages to which it freely chooses a response; it is its environment.
Re:Mechanical Watch by TedDoesntTalk on Thursday May 05, 2022 @12:39PM (#31275553)
Your insight is remarkably well-written. I wish we could see our bodies in the same way, all of the time. The world might be a kinder place overall. Do you meditate?
Re:Mechanical Watch by kragen on Thursday May 05, 2022 @01:55PM (#31276549)
Not enough to be useful. But I'm glad you enjoyed it!
Re:Mechanical Watch by indigochill on Thursday May 05, 2022 @08:13AM (#31272343)
But even if we're arguing physics, that's debatable. The shape and toughness of the rock are actually an effect of forces between the atoms composing the rock, and the weight of the rock is actually the interaction between the mass of the rock and the earth. The color of the rock is the effect of the interaction between the molecules in the rock and photons (which are themselves wave-like) and then the interaction between that light and the cells in your eyes.

Objects are a convenient day-to-day model in real life and software, but there are more "functional" models that comprise the object model.

Re:Mechanical Watch by kaba0 on Thursday May 05, 2022 @05:49AM (#31271401)
I don’t see how someone not understanding GL first can do anything useful with it. Like, what would such people even use it for? If they need a complete solution just use a plugin that displays some rotatable 3D model. But I really don’t see the value of planning for the lowest common denominator in case of a highly specialized domain specific API.
Re:Mechanical Watch by andai on Thursday May 05, 2022 @01:12AM (#31269755)
Now compare it with Flash ;)
Re:Mechanical Watch by dncornholio on Thursday May 05, 2022 @03:32AM (#31270611)
ActionScript was fucking great. :(
Re:Mechanical Watch by lostgame on Wednesday May 04, 2022 @07:45PM (#31267402)
Holy living crap. I was all with it up until I saw the actual full HTML example. That is an incredulous amount of overhead for what is essentially one of the most basic and fundamental operations in *GL.

Comparing this to Canvas is almost like comparing assembly to C. I'm honestly very surprised.

Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @07:51PM (#31267466)
Though boilerplate is never acceptable, most of that is constant-factor overhead, not per-triangle overhead, and tutorialspoint is not a site you should trust under any circumstances. See my links above for better sources.

If you put more vertices and indices in Step 2 you can draw an arbitrarily complex 3-D object with this same code.

And there's a lot of stuff in GLSL where you can program directly with high-level concepts like vectors, normals, and partial derivatives, instead of expressing them by hand the way you would in C.

Re:Mechanical Watch by woojoo666 on Wednesday May 04, 2022 @07:58PM (#31267533)
Using a framework is also constant factor overhead (at least in LoC, which is what I assume we're talking about here)
Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @08:19PM (#31267718)
Right, and that's what the glslCanvas project I linked above is, though in this case it's negative overhead if you're just counting the lines of code you have to maintain :)
Re:Mechanical Watch by woojoo666 on Wednesday May 04, 2022 @09:14PM (#31268165)
Ah gotcha. Yeah I was alluding to ThreeJS, a very powerful and standard framework for webgl
Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @09:28PM (#31268261)
Yeah, ThreeJS is awesome! glslCanvas is just for drawing with shaders, not for general 3-D.
Re:Mechanical Watch by donatj on Wednesday May 04, 2022 @07:57PM (#31267513)
Yup. This is why my crappy little 3D game engine still uses canvas and not WebGL. I can’t feel good about myself and deal with all that.
Re:Mechanical Watch by kragen on Wednesday May 04, 2022 @08:16PM (#31267688)
Yeah, Canvas 2D is great, though it's not any more OO than WebGL, and I sometimes forget to create a new path and wonder why it keeps getting slower and slower with every frame. SVG is also pretty reasonable.
Re:Mechanical Watch by andai on Thursday May 05, 2022 @02:00AM (#31270053)
Neat, you do the math yourself and then render the tris/quads in canvas? I did something like that recently (in C/SDL, later RayLib). I found it amusing that to get performant 2D rendering you have to use a 3D API, so my "software rendered" 3D engine which just uses the gfx api for 2D draw calls ends up using 3D for the 2D under the hood...

There's at least one (great) game written like that though, Need for Madness with a custom 3D engine and just using java's 2D gfx api for rendering.

Re:Mechanical Watch by kragen on Thursday May 05, 2022 @01:57PM (#31276562)
I did this in 02007 in JS: http://canonical.org/~kragen/sw/torus

Except that WebGL didn't exist so I just had to use the 2-D <canvas>. There's probably some trick for getting antialiased polygon edges in <canvas> to not show cracks...

Re:Mechanical Watch by Crabber on Sunday May 08, 2022 @09:32AM (#31303814)
All OpenGL does it draw triangles.

Once you get through the process of drawing a triangle on the screen then you're learnt 70% of the core of OpenGL. I think you're making the incorrect assumption of "wow if it takes this long to just get a triangle on the screen it must take 1000x as long to get an entire model of a watch" when really you're almost able to draw a model already, you just need to put multiple triangles on the screen now instead of just one.

Re:Mechanical Watch by abhayhegde on Wednesday May 04, 2022 @02:28PM (#31264130)
Apart from going to each post and manually looking at the JS codes, is it possible to get them all in one go? https://ciechanow.ski/js/ returns 403 error.
Re:Mechanical Watch by syncsynchalt on Thursday May 05, 2022 @02:32PM (#31276927)
wget will do what you want, with the right flags. Try `wget -r https://ciechanow.ski/mechanical-watch/ --include-directories=js/`, the resulting `ciechanow.ski/js/` dir should have it.

Adjust the flags as necessary to crawl more of the site if needed (omitting `--include-directories` without an `-l {limit}` flag will eventually crawl the whole site, please be kinder to their bandwidth than that).

Re:Mechanical Watch by Cthulhu_ on Thursday May 05, 2022 @04:16AM (#31270873)
I like that; it's a lot of work but a lot of people seem to prefer to have to make libraries work together than to just do the work, and it's timeless since it doesn't depend on any future frameworks; any issues that might come up in the future with regards to browser incompatibility can be fixed relatively easily.

Would antifragile be an applicable word to use here?

Re:Mechanical Watch by ojr on Thursday May 05, 2022 @05:09AM (#31271185)
I have a WebGL project thats been broken for a few years due to a browser deprecated api, it is not a relatively easy fix
Re:Mechanical Watch by beeforpork on Friday May 06, 2022 @04:04AM (#31282599)
Frameworks change and get in the way when a new version is released. It is most annoying. The underlying WebGL changes much more slowly, and in a much more controlled way with a focus on backward compatibility. So I do the same whenever I can and ignore frameworks to get rid of a dependency. The boilerplate overhead can be encapsulated very well into homemade JS functions that only change when I change them. And JS + WebGL is not really low-level.
Re:Mechanical Watch by tomcam on Wednesday May 04, 2022 @09:25PM (#31268236)
Holy shit
Re:Mechanical Watch by hilbert42 on Thursday May 05, 2022 @08:46AM (#31272627)
" Turns out he codes everything by hand in WebGL"

You really have to admire people who do stuff like that (I can't imagine that I would ever have the patience to do that).

What I'm mildly curious about is why would anyone want to do it? Is there a demand for such stuff? I can understand it if the exercise was for training people but wouldn't most people who were interested in the internal workings of watches already be familiar with them?

I'd reckon most would be like me in that they'd pulled enough watches apart in their younger years to already know their ins and outs (I've long lost track of the number watches and clocks I've either fixed or disassembled by the time I was a teenager).

Re:Mechanical Watch by syncsynchalt on Thursday May 05, 2022 @02:37PM (#31276967)
There's little benefit to writing your own asm these days[1], yet we need people who know asm intimately to write compilers.

It's the same here. Without people who deeply understand a tool's input and output, we won't ever write a better tool.

[1] don't @ me, cryptographers and kernel programmers.

Re:Mechanical Watch by hilbert42 on Friday May 06, 2022 @10:26AM (#31285499)
"There's little benefit to writing your own asm these days"

Agreed, but programming in ASM makes one think differently. In my opinion every programmer should do some elementary Assembler as part of their training, say some basic projects based on 8086 stuff or even the simpler 8085/Z80 etc. It's a long while since I've done any serious ASM work but the techniques one learns and the ideas one develops frame important attitudes that can't be easily gathered from high level stuff (one gains a better understanding of the underlying hardware and such).

You're right, we still need people for this work, it'd be pretty hard to optimize a compiler without them methinks.

FYI, there's stuff I omitted to mention in the above comment, I mentioned it below in my reply to bitcurious. It's interesting 'fitness for purpose' arises given your ASM comment.

Re:Mechanical Watch by bitcurious on Thursday May 05, 2022 @12:06PM (#31275125)
> I can understand it if the exercise was for training people but wouldn't most people who were interested in the internal workings of watches already be familiar with them?

Most young people don’t even have access to a mechanical watch these days.

Re:Mechanical Watch by hilbert42 on Friday May 06, 2022 @09:49AM (#31285045)
I fully accept your point that 'most young people don’t even have access to a mechanical watch these days' but I'd contend that that ought not be relevant (as I'll explain in a moment).

First, I should say that I was perhaps a little harsh in my above comment and I didn't convey what I actually wanted to say. Unfortunately, I was distracted by the somewhat irritating fact that I couldn't view any of those drawings on two different smartphones (I could read the article but only saw white spaces where the drawings were supposed to be). It was only later when logged onto my PC that I could view them, and even then the whole page was sluggish and a pain to view. Perhaps those with faster equipment and or faster internet connection had better luck.

Thus, the thinly-veiled message behind my comment was a question about fitness for purpose—both about the subject matter and its method of delivery. My cynical inference was that if people today didn't already understand the basics of gearing, mechanical advantage and escapement mechanisms etc. then something has gone wrong with the education system in that the basics of how clocks worked were well covered in physics (in mechanics) during my first year in high school—and that should not have changed as we still live and move around in a mechanical world—and thousands of industrial mechanical devices use these principles and rely on people having a good working knowledge of them.

By third year physics, everything relevant about the essential workings of a clock would also have been covered at a basic mathematical level: Hooke's Law, gears and gear ratios, friction and simple harmonic motion. Even temperature expansion and contraction and the need to compensate for them was discussed (and in this context the physics teacher even discussed Harrison's famous chronometer and how his design included temperature compensation to ensure that changes in these parameters did not impact heavily on time drift).

In essence, by third year, everything of important in that article had been covered in the school curriculum. If articles such as that under discussion are now being used to compensate for the lack of training in high school science then we have a serious problem with the education system.

Incidentally, even if one's not interested in clock mechanisms, it's worth having a look at this 19th Century publication on mechanical movements that's on the Internet Archive (there are more types around than most people have ever likely considered: https://archive.org/details/Mechanical_Movements_507

Re:Mechanical Watch by syncsynchalt on Friday May 06, 2022 @04:03PM (#31289131)
I might be an outlier in how I learn, but I find that learning happens in multiple passes.

First, I learned a concept in school, and probably forgot it. Later, I heard about it again, and hung the concept on the skeleton of what I remembered from school. Only much later, when I'm actually applying the concept (in my career, during home repair, when doing my son's homework), do I connect the dots and really understand the concept front to back.

When talking to people I'll say I learned the concept {of gearing, of escapements, of the behavior of springs} in school. But it's probably just as accurate to say that exposure to experiences like this site were what truly cemented them in my mind.

Re:Mechanical Watch by hilbert42 on Sunday May 08, 2022 @02:16AM (#31301775)
"I might be an outlier in how I learn, but I find that learning happens in multiple passes."

I don't think so, I'd reckon you'd be pretty typical. It's basically how I learn things and I'd think it's how most others acquire skills.

From my experience, the key issue is having an interest in the subject, subjects that I was interested in I did well in and it was the opposite for those that bored me. I suppose that makes sense but in both cases multiple passes were required before I became proficient - it's just that it took considerably longer when my interest was less.

However, what I've noted on many occasions is that there are students who I'd classify as a class that are just good at learning things even if the subjects have little interest for them per se, they're the ones who would often top the class and later in life you'd find them doing jobs unrelated to the subjects they did well in. I often think I'd like more of that trait.

For reasons I can only speculate about, my interest in certain specific subjects seems to have inate origins, it's as if some a priori interest was there before I knew about them. This doesn't necessarily bode well for other subjects that are deemed essential for one to become skilled in as one's learning can become lopsided.

There's little doubt that hands-on training works for most - and that brings me back to clocks. In physics practical classes on tension, springs, mechanical advantage, etc. we actually had clocks to experiment with. These were usually old bedroom alarm clocks and such that could be pulled apart and reassembled and if damaged it didn't matter much. We all learned from these experiences, even kids with little mechanical aptitude as clocks contains just about every instance of the physics we were learning about and it was obvious how they all came together to make clocks work.

Re:Mechanical Watch by accountofme on Saturday May 07, 2022 @05:03AM (#31293112)
Absolutely the best use of web tech I have seen. The best way to put it, is magic.

Great great great work!!!

Re:Mechanical Watch by sha-3 on Wednesday May 04, 2022 @12:35PM (#31262762)
Yep, that's why the visualizations do not run on my hardened Firefox. I disabled WebGL.
Re:Mechanical Watch by bananabiscuit on Wednesday May 04, 2022 @12:41PM (#31262825)
You should considering enabling it for this site. I don’t see what the downside here would be.
Re:Mechanical Watch by sha-3 on Wednesday May 04, 2022 @01:01PM (#31263071)
And it was worth it.