Hacker Newsnew | past | comments | ask | show | jobs | submit | juretriglav's commentslogin

I managed to run the 64k block example, i.e. 64 10x10x10 stacks at about 40 fps a little while back, before I included the joints and springs support in the solver, so I'm positive that number can be made to run smoothly in real-time if you're laser focused on rigid bodies and optimize the pipeline specifically for it. With everything enabled though, I think about 10k bodies is the reasonable limit on my M3 Max. I do want to attack performance next, since I was mainly focused on stability and good support for various modes of physical interactions.

Thanks! Never been easier to start than right now. This physics engine is a bit opaque in terms of how it works, but I recently wrote about a global illumination approach that uses surfels - I break it down into small manageable pieces, with plenty of interactive visualizations, and it's also in WebGPU! If you have some time, maybe take a look at that and start taking it apart: https://juretriglav.si/surfel-based-global-illumination-on-t...

I actually have an implementation of that too, since I was fascinated by the twisting cloth example, but need to figure out how best to incorporate it, or if it’s better in a standalone experiment.

The excellent 3D demo on that page is CPU based, serial.

These examples are amazing, though compute heavy and built with WebGL, which is less than an ideal fit for it. This website and project have been around for a couple of years, and the web's graphics capabilities have grown since, bumped up significantly by the introduction of WebGPU. And since Firefox introduced support for it in 141 on Windows, and 145 on macOS (see wiki tracking implementation here: https://github.com/gpuweb/gpuweb/wiki/Implementation-Status), it now also enjoys broad cross-platform support (Windows, macOS, Android, iOS, with Linux trailing a bit behind).

I've recently written about another compute heavy global illumination approach, which is all but impossible to pull off using WebGL: https://juretriglav.si/surfel-based-global-illumination-on-t...

After this experiment (and some that are in progress), and some very recent movement on raising the bound storage buffer limit in Chrome (https://issues.chromium.org/issues/366151398), I can't help but feel that we're on the cusp of an AAA-level experience built exclusively on the web. I'm super excited for the future of computer graphics right in your browser.


Thanks! Absolutely, dig in, the code is MIT :). I bet your previous experience would lead to significant speedups/quality improvements somewhere in the bowels of the pipeline. Contribs very welcome, too!


Can we use WebGPU to compute real-time global illumination with surface patches called surfels? Does it look good enough? Is it fast enough? And can we finally construct viable compute-heavy rendering pipelines right here on the open web? Join me on this journey and let's find out!


Hm, I'm not entirely sure if you're being sarcastic or not, but just in case, asking Bing about the menu I get this:

> Chez Panisse is a famous restaurant in Berkeley, California that serves seasonal and organic food1. The menu changes daily and is posted on their website2. Today’s menu for the restaurant (not the cafe) is:

> Fennel and leek salad with rocket, toasted almonds, and salsa verde > Bomba rice cooked with clams and squid; with aïoli > Becker Lane Farm pork loin roasted with Spanish paprika and green garlic; with > braised greens and wild mushrooms > Meyer lemon sherbet with candied kumquats > The price for this menu is $175 per person2.

That seems to be correct.


Where do you see "Meyer lemon sherbet with candied kumquats" on the menu?

https://www.chezpanisse.com/1/restaurantmenu/

This is what's there for today:

- Fennel and leek salad with rocket, toasted almonds, and salsa verde

- Bomba rice cooked with clams and squid; with aïoli

- Becker Lane Farm pork loin roasted with Spanish paprika and green garlic; with braised greens and wild mushrooms

- Blood orange and vanilla ice creams with Page mandarins


I've been following this closely. Given the preview with some components listed it seems exceptionally well made: https://tailwindui.com/components

There are also live demos of the app and marketing pages:

1. https://tailwindui.com/page-examples/landing-page-01

2. https://tailwindui.com/page-examples/detail-view-01#

Plus a screencast on how to use it to build these pages: https://vimeo.com/393580241/82c6d7c5f6


Looks good and polished, but that landing page requires 165 KB of CSS, gzipped. That's, to put it lightly, ridiculous.


Yes, but that's just because I think for simplicity they created one large CSS file that is used for all their components and example pages. That's not very realistic. You're not supposed to do it like this for your own project. Instead if you use Tailwind CSS and PurgeCSS I'm pretty sure you would end up with ~10 or 15 kB of CSS gzipped, maybe less.



> You're not supposed to do it like this for your own project.

If even the creator of Tailwind doesn't use Tailwind properly, does anyone?


They are using it properly. It's just that they're using a single css file across all the examples and component pages.


I don't think that's it. Open https://tailwindui.com/css/app.css and Control-F for "placeholder-" -- are there really examples and component pages on this website that set the input placeholder text color to every single different color in the color palette, at every responsive breakpoint?


I'm tired of excuses for inferior tooling. If you truly know CSS, Tailwind is a waste of time.


I've been reading awful takes like this since I started writing software.

"PHP is an awful language, superior developers write in Perl."

"Rails is bloated and slow, making it unfit for any real work."

"True developers don't rely on frameworks, writing all your own code is the only way to be performant."

If you wanna handicap yourself, be my guest.

I've written three or so projects in TailwindCSS, and it lets me create responsive designs quickly. It gives me a very sane set of defaults to build off of. And most importantly, it helps me get a product to production faster than writing raw CSS.


that may be so, but I think it's a valid point to bring up the tradeoffs you're making, including using a non-standard dsl that other designers/developers/hires will likely be unfamiliar with.

personally having written css since I was a teenager, my gut reaction is "eww", but if the team or stakeholders deem it to add value to a project and not affect productivity, sure why not?


The grandparent comment wasn't "bringing up tradeoffs". They literally just said real devs don't use frameworks.


I think it’s not for people who know CSS. It’s specifically for SPAs where site-wide changes are related to component changes and so having to change the html is not that different from changing the css.

I can not force myself to use something like this but I’ve been writing CSS for a long time.

I use BEM and predefined sets of colors and space values to ensure consistency and that’s efficient enough for me.


Quite the opposite. It's a nice set of CSS variables. It still relies on much more CSS knowledge than a framework like Bootstrap.

CSS frameworks are great because there is a flavor that should fit just about anyone.


It seems to require so much CSS knowledge that you might as well just use regular class names and write the CSS components yourself as it requires you to understand how flexbox etc works anyway to use it's utility classes properly.


You're right. Don't use Tailwind if you don't know CSS well.

The use case is for creating Template Components with something like React, Vue, Hugo, Razor or another component template framework. Tailwind offers a large list of customizable variables to use to help keep your CSS consistent. You're still pretty much writing CSS though, just with shortcuts. I consider it Emmet CSS + Variables. I also highly suggest using a plugin for your editor that offers hinting on all the crazy names no matter what CSS framework you use.

If you want a higher abstraction, Bootstrap or Foundation provide that. There is now also this Tailwind UI that you can purchase that would also provide that to some degree.


I thought the anti-css crowd who use React etc generally preferred some form of Styled Components where the style is written in JS? It's a mixed up world of factions :)

Whether building a regular website or a web-app I generally just use component names (like .card) the same way. I'm more of a fan of defined components with limited variations though than people being able to change anything with a lot of utility classes. Sort of like having a succinct API with a constrained depth. I see css as an api to the original designs and Tailwind introduces too much freedom for my comfort! I will endeavour to give it an honest trial though and maybe I will meet you somewhere in the middle.


Styled Components still uses CSS, it just removes the ambiguity and additional abstractions around class names.


This is where I ended up with this framework. It requires so much css knowledge that it is for the advanced but not expert who would be bothered by a number of things.


If you truly know assembler, C/Python/Ruby/Go is a waste of time.

See how dumb that sounds?


Following that analogy, Tailwind is C files that only contain inline assembler blocks.

Yes, you can check off on your list that you no longer have any .S files. But did you actually gain anything?


I can see it now:

> Most C libraries do too much.

> They come with all sorts of predesigned components like functions and structs that might help you move quickly at first, but cause more pain than they cure when it comes time to make your program stand out with custom behavior.

> Tailwind C is different.

> Instead of opinionated predesigned components, Tailwind provides low-level utility macros that let you build completely custom functionality:

    void main() {
        BEGIN_TAILWINDC
        MOV(RAX, 4);
        MOV(RDI, 1);
        MOV(RSI, "Hello world!\n");
        MOV(RDX, 13);
        INTERRUPT(128);
        END_TAILWINDC
    }
And then every Hacker News discussion of Tailwind C would inevitably include a link to their "Why using Tailwind C is definitely not just as bad as writing inline assembler" documentation page.

Ooh, and then the creator of Tailwind C would start selling the Tailwind C Library, with like an implementation of memcpy that you just cut-and-paste into your program every time you need to copy memory.


I get the sentiment but Python is to assembly as Tailwind is to assembly. It's too far removed.

The leap between vanilla css and tailwind is not large at all.


It’s not a perfect analogy, I will concede. C to assembly is closer. That said...

Assembly: raw html and css C: A framework like Tailwind Python: Components, like TaildwindUI or any of the React components I’ve seen

I think that’s not a bad analogy.


Disagree. Dumb is doing the same thing over and over again and creating new tooling to do the same thing over and over but with added dependencies and frameworks. The fundamentals of web development have barely changed but the flavor of the month way of doing the same thing is constant.


HTML and css are way too low level to be productive in, in my opinion. Especially when dealing with wide ranges of screen sizes, browsers, and platforms. The only way I’m interested in touching the stuff is if there are tools to alleviate the pain.

Caveat: not a UI developer, I’ve mostly done backend work And DevOps for quite some time.


HTML and CSS are too low level? Does such a tool like dreamweaver with response rendering exist?

It's an interesting concept.


I base my comment on the effort required to make a simple web page that a) looks the same across different browsers and devices, b) is responsive, c) supports relatively basic concepts like dropdown menus, columnar layouts, etc...

It’s way too much effort for me to want to mess with, and then you have to repeat the same things for every site you make.


This kind of attitude, while totally relatable IMO as we grow frustrated with massive piles of crapware, is also how we wind up with NIH problems as organizations scale beyond just a few people. There is a very consistent theme by their creators across companies large and small - brilliant, productive, controlling, and eventually fired.


I'm kind of with you on this. We're rebuilding a large internal admin tool with all in house css and components, it's tiny and fast. We didnt want to bring in bootstrap or some other huge framework. Those were fine when I was a jr developer - not anymore


> We're rebuilding a large internal admin tool with all in house css and components,

Why would you have shared in-house css and components? Just write vanilla css right?

Tailwind is that shared in-house css and components for people/team that don't have shared in-house css and components. If you can afford to build one, sure use that!

This is made for prototyping too, this is to get to the MVP quicker. Again, if you have a shared in-house css and components library that does the same, sure use that instead, it makes much more sense!

> Those were fine when I was a jr developer - not anymore

That's a scary sentence. Why do you believe it matter whether you are junior or not to use that library? A library is made to avoid doing twice the works. If you already did that work, you don't need that library, that's for sure, but it's totally unrelated to your level as a developer.


The internet is in a perpetual state of beginner dev tutorials and junior developer tools. I am still waiting for the awesome stuff to come out but it all the same stuff.


I'm sure that in an actual project, you can use tree shaking or a custom build to avoid including components you don't need.


Is there a production-ready CSS purger that's not written in JavaScript? Last time I looked I couldn't find any.

I'm not particularly against JavaScript, but I'm not willing to install and use npm and several hundred dependencies.

All documentation for purgecss always includes postcss and a gazillion other packages I have never heard of.

Maybe something in Go, as a single executable?


https://github.com/leeoniya/dropcss

still in js, but very fast, ~10KB (min), 0 dependencies, and does not require npm [1]:

however, it expects properly formed html and css; the parsers are quite unforgiving.

(i'm the author)

[1] https://github.com/leeoniya/dropcss/tree/master/dist


Thanks! Properly formed input is not a problem in my case.


I don't know a non-JS CSS purger, but you don't need postcss to use PurgeCSS.

https://purgecss.com/CLI.html


"but I'm not willing to install and use npm and several hundred dependencies"

Good luck being a employable lol


Fortunately, there are many IT jobs that don't include any web work.


For comparison, what is bootstrap v4's weight?



[flagged]


Congratulations on leaving your bubble. And welcome to the developping world. 165kb is a pain in the ass over 3G, and when people buy loads for them sim card giving them a data amount still measured in megabytes, it matters a lot, even the big ones like facebook had to make lite versions because of it.

You're going to rediscover all kinds of other cool cool stuff you forgot you could do whle wasting resources in the last decades. With everyone going with bloated mess and electron apps, it is a really amazing time to be building snappy softwares now. So, again, welcome.

(the arrogant tone of your message was really misplaced)


>Congratulations on building your time machine. And welcome to 2020.

Please don't do that. You are using sarcasm to ridicule the guy you are responding to, and that's an unproductive way to argue.

It is also against HN comment guidelines (https://news.ycombinator.com/newsguidelines.html):

"Be kind. Don't be snarky. Comments should get more thoughtful and substantive, not less, as a topic gets more divisive. Have curious conversation; don't cross-examine.

...

Please respond to the strongest plausible interpretation of what someone says, not a weaker one that's easier to criticize. Assume good faith."


REPLs are not new. At all.

165KB is still a lot of pretty-making text. Attitudes like that are why "webapps" eat hundreds of megabytes of memory for tasks where low-tens would be more than enough, even allowing for some slopping programming and lots of abstractions. That 165KB hangs around in memory in probably more than one form, and becomes part of future layout decisions on the page, if they come up.


>Did you know you can build and deploy an entire application without ever running a compiler or touching a physical machine now? We have REPLs were you can interact with your application live, in real time.

How do I interact with REPLs in real time without touching a physical machine?


Do these stylistic simple preview images have a name? I have been searching for these for a long time to use in my application without designing them all by my own. A free-to use pack of these would be really great.


"Product Illustration" is what Steve (the designer) calls them. See: https://www.youtube.com/watch?v=1HDR-AV4ODU for a livestream of how he makes them


All of these new frameworks look great, but there just isn't a good way to switch from, e.g., Bootstrap to a new one. I've never come across a framework that had any kind of conversion tool or even a guide on how to efficiently switch.


Jason McCreary from Laravel Shift made a tool called Tailwind Converter which will convert Bootstrap code to TailwindCSS. It's pretty wild. https://laravelshift.com/convert-bootstrap-to-tailwind-css


It converts the css but keeps the markup.


Right now I don't think CSS frameworks are intended to be a drop-in replacement; each one will also introduce a subtle change in style that you have to work with. In theory you can rebuild your application reusing functional components and only replacing visual ones, but it's still going to be a lot of work.

But I think a lot of people wouldn't just replace the CSS framework, they'll rethink the whole UI and everything that goes with it with a big operation like that.


How did you access the page examples? I can't find a link to them on their components page.


They were linked to in a message via their mailing list.


<p class="piew1 piew2 piew3 Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo expedita voluptas culpa sapiente alias molestiae. Numquam corrupti in laborum sed rerum et corporis. Nemo expedita voluptas culpa sapiente alias molestiae" id="Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo expedita voluptas culpa sapiente alias molestiae. Numquam corrupti in laborum sed rerum et corporis. Nemo expedita voluptas culpa sapiente alias molestiae">

</sarcasm>


The site appears to be down now.


Consider applying for YC's Summer 2026 batch! Applications are open till May 4

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: