Blog

This new release marks a significant paradigm shift in coding approach, but one that is fully backward-compatible -- sequential target selectors and action commands! Now you can code your commands in a certain order and they will run in that order.

It may appear odd that it has taken this long to start using sequential commands. Every other functional programming language uses sequential commands. So why has it taken this long?

The main reason is that CSS has no particular emphasis on sequential commands. The hierarchical rules of CSS are more like conditional decisions on which command to run of the same type, so that's not the same thing, even if there is a flow downwards in a CSS file. The commands in CSS are just all supposed to happen at once. You could call them static commands - there is no visible vector, or direction, of command sequence. And CSS has been the pillar on which Active CSS is based. The Active CSS syntax evolution tries to follow CSS rules right up to the point where it ceases to make sense to do so.

A lot of website functionality has been written on various types of websites, including such complexities as custom login authentication and e-commerce integration (all within an SPA context), and not having sequential commands hasn't particularly been a big deal up to this point. But "after stack" was found to be used quite a lot to make sure specific commands happened after other actions. It has usually been only one command in a declaration that needed to happen after others. This seemed a bit hacky. What if two commands ever needed to be run in sequence?

The simplest solution, and one which didn't require any additions to the language, was just to make sure that all target selectors and action commands run in sequence as they appear in the config.

This approach to coding config declarations just seems necessary at this point.

Will your existing config break with this upgrade? No. Why? Because it didn't matter what sequence your commands ran in in the first place. They just run in a certain sequence now. Before, you used "after stack" or "after 0s", and that still works. So nothing should break.

Does this change affect Active CSS being incorporated into the browser? No. Active CSS declarations can be treated as different entities to CSS declarations, and they can be detected and handled differently to static CSS commands, yet they could live in the same file. Right now, they have to live in separate files, but once Active CSS is in the browser then CSS and Active CSS commands can co-exist in the same file.

But this change does allow you to optimize your code and see some improvements in performance. You can now go through your config, searching for "after stack" or "after 0s", and potentially remove these parameters and move your action command to the end of the flow in the declaration. This optimization will make things run visibly faster. You should see a visible difference. It is definitely worth doing, and it shouldn't take very long. Things will be smoother. Rarely, you might have to leave "after stack" there, so do test your work when you make a change. But most of the time you can just re-position your action command to get everything running in sequence.

Do bear in mind though that this release does not change anything regarding asynchronous commands like ajax. You still need to use the afterAjax event to handle ajax commands. This release only affects the order of synchronous commands.

You can now have nested loops around target selectors too! (We'll be adding a @for loop command shortly...) You might also notice a slight speed-up in initialization.

This release has set back the release of the extension somewhat, as there is now a whole array of changes needed to do with editing positionable commands in real-time, but this upgrade needed to get done. Work on the extension will continue again soon.

Thank you for the support! As always, if you get any amazing ideas or just want to spark up a conversation, then get in contact!