Wiki 3.0 Implementation choices - UI Framework

[mleduc]

@ludovic

1/ Try to isolate our logic code from the Vue (Vue3) specific code. This means trying to move a lot of the logic code in libraries which are as much as possible independent from Vue, designing APIs for the Vue specific code with specific implementation for Vue

+1

@ludovic

1b/ Study if it would make sense to encapsulate Vue specific structure when we manipulate them in our logic code.

While I agree in principle, we also need to be careful to take into account encapsulation overhead, while could lead to degraded performances if done wrong (e.g., even too much Vue components nesting can lead to performance issues if not done correctly)

@ludovic

2/ Study web components and check if it would be possible to choose for our design system a web component based UI library (instead of a purely Vue based library). This is not so easy as the Vue libraries could be better on other criterias.
I’ve described some approaches around web components: Technologies (Proposal.Wiki30.Technologies.WebHome) - XWiki

I started to have a look on this and:

1. Web Components can be used (including reactiveness) inside Vue templates
2. Some neat web Components libraries seems to exist. I think Vaadin is worth looking in more details for instance.
3. It could also be interesting to check further how to implement Web Component with Vue 3
4. It could also be interesting to study more lightweight libraries dedicated to the definition of Web Components (e.g. https://lit.dev/)

Probably over optimistic, but while Vue 3 was a major version upgrade, the Vue developers are aware of the migration pain and quoting them (When would Vue 3's end of life be? · vuejs/core · Discussion #7887 · GitHub):

When we do another major release, it will be much more modest and ship few breaking changes that will be easy to migrate.

We certainly don’t want to repeat the pain of Vue 2 → 3.