I'm going to be brutally honest about au2

Typically, if I read something several times, I’ll figure things out. But for this review, I’m giving you some first impressions of the new au2 “simple install” features. If i’m struggling with this with years of using Au1 and angular and svelte… Then just imagine how a beginner perceives things.

I have 2 topics for you, that really need that “beginner-friendly” design approach otherwise it is going to confuse a lot of people.

Also do NOT recommend “VITE”, webpack is just so much faster in every way. I don’t know why anyone would recommend vite.

Topic 1: ShadowDOM

  • ShadowDOM is horrible. Not because the idea is bad, the idea is amazing, to encapsulate everything so that external things don’t interfere. But it doesn’t work out off the box. It doesn’t work in open-mode. You install something like Bulma or other CSS frameworks and everything breaks, even in open-mode. You add the necessary decorators to various components, it’s unclear which ones you need to add it to (everything?). It’s just bad design. Default modes should be beginner-friendly, not complicated. You can make things complicated with additional parameters/configs. Defaults should work for everything.
    • it’s unclear what CSS styles are active and which ones aren’t and the page becomes broken.

    • adding shadowDOM() with default open mode, and

      .register(StyleConfiguration.shadowDOM({
      
          // optionally add the shared styles for all components
      
          sharedStyles: [shared]
      
        })) 
      
    • —- seems to do nothing. 
      
  • When setting up the project Aurelia2 should say “do not use ShadowDOM except if you are an expert” (or unless you use the pre-built template) — It’s not because I don’t have years of experience, it’s that it is just not intuitive, it is counter-intuitive. And if I have to read a ton of articles just to get basic things to work, well guess what? Very few people will do that except professionals paid to figure it out. Certainly hobbyists will quit. Certainly, people who just wanted working CSS and themes and dark-mode will quit. They’ll just give up. I myself will be switching back to CSS Modules which seems to work better. So just put “Install ShadowDOM? [Advanced]” … The design of ShadowDOM probably needs many new versions over many years before it becomes intuitive and easy to figure out. You may think it is easy – but it is not easy. I’ve gotten it working before in the past, but a few months pass by – and suddenly shadowDOM doesn’t work anymore. That is a recipe for disaster and frustration, if people cannot remember how to get it to work.

– Topic 2 Routing:

  • Routing between router-direct and router is confusing. Why create the confusion in the first place? Just have “router” (default) and “advanced-router” so that people know not to use the advanced one. It’s confusing. I read the comparison chart, the comparison chart itself is confusing, it says “oh use Router navigation” in this one, and not in the other, it doesn’t explain the why. Then there is a “why use Router direct” and “why use Router” – this is wonderful idea, but barely goes over many reasons. It’s just not clear which is better or easier or harder. One of them says centrally managed routing, ok but doesn’t every app in the world basically have centrally managed routing? Anything with a login will have secret menus, so that topic must be covered. Menus that get fetched from backend and created with “auth” attributes.
  • There should be a “Complex centrally managed router (with secret admin menus)” StackBlitz example. What is every developer going to do? They’re going to loop through and create some menus and submenus, then they’ll create some admin or authorized member menus. That’s all most people want from a route. If this basic use case for beginners is not clearly done at the start, it’s going to confuse people. Especially when they’re trying to remember “was it href= I use here or load=” — I love the fact for example that “external” attribute was added to tags.

If you get angry at what I wrote, just think back to the time when you were a beginner… I’m not writing this because I dislike Aurelia. I’m writing it because I like Aurelia.

I will figure out these problems eventually – but it is frustrating when basic things become so time-consuming. But think back to when you were a beginner, you will realize just how annoying this stuff is.

4 Likes

I think in both cases you have a point.

My experience with the Aurelia 2 documentation:

  • I only find my way pretty easily in Aurelia 2 because I have experience with Aurelia 1 and for Aurelia 1 you could find things on Stackoverflow etc. Luckily there is Discord.
  • The docs layout looks very clean and the Youtube tutorials are a nice addition
  • The docs are clear if you know what to search for, but beginners sometimes have no clue why a concept exists, for example using a ‘matcher’ for a component.
  • You have a ‘Hello World’ and ‘Intermediate Tutorial’, they are both quite basic. A more extended tutorial like the Svelte tutorial would be a great addition for Aurelia 2 newcomers where you build a small app that introduces the router, event aggregator, bindable, observable, slots, … and explain how to do non-trivial things like communicating between a deeply nested child component and a parent component
1 Like

Extremely valid pieces of feedback and stuff I am actively addressing as we speak. There is a more comprehensive tutorial coming. I honestly don’t know why there wasn’t a more comprehensive extended tutorial, ha.

One thing we did recently was remove the router-direct docs from the main docs. It was a point of confusion and the docs are still available in the repository, we understand a lot of people defaulted to the @aurelia/router package because they wanted routing that was like Aurelia 1 and on parity with other frameworks and libraries.

We value the honesty of the community. Please don’t feel like you ever have to censor yourself if it’s constructive feedback. This keeps us moving forward and honest. It also ensures that Aurelia is what the community wants it to be and not what the core team wants it to be. This feedback however honest and confronting is never ignored and we are actively looking for ways to make everything better, even if it’s docs.

2 Likes

I’m not an expert in Vite nor Webpack, but honestly so far I’ve found Vite better for my projects. Granted they are far from being converted

100% agree with everything else. I sorta feel locked in being on a small team with a large AU1 project. I’d like to keep it modern so AU2 is the obvious choice there.

1 Like

Yes, same here.
But, I have hope that with use of AI any migration can be done without too much hassle. See Justifing Aurelia to myself - #40 by mroeling

I’ll keep you informed!