[Horizon] Paging and Angular...

Marek Lyčka marek.lycka at ultimum.io
Wed Sep 18 08:38:05 UTC 2019


Hello,

> You seem to be missing the point. The alternative to Angular is not
JQuery, it's a proper implementation on the server-side,
> both in the APIs (for pagination and filtering) and Horizon itself.
Slapping JavaScript on top of it, whether it's Angular or
> JQuery, won't improve the situation.

No, I understand what you're saying, I just don't think it's very
realistic. Exclusively using server side templating has some issues
in terms of usability and performance which might not have satisfactory
solutions. For example:

- Any interaction causes a roundtrip to the web server and the backend API,
which reduces performance, especially with large data sets.
- In some cases, datasets are composed of multiple API calls with disjunct
results (see Networks [1] for an example). Paging and sorting over these
datasets
  requires for them to be reconstructed on the webserver for every paging
or sorting request and that means a full data load. For any at least
somewhat sizeable
  datasets, this creates performance issues.
- UI loses reactivity. Interfield interactions, for example, are basically
impossible because of web server centered re-rendering, which reduces user
comfort and usability.

Moving logic to the client using JavaScript does improve the situation:

- Data can be loaded in chunks asynchronously in the background without
impeding the rest of Horizon
- Cached data can be operated on (paged, sorted...) without additional
requests to the web server and backend
- Data can be shared between different horizon elements without the need
for a reload - e.g. loaded networks
  can be used in the network index table, the Launch instance dialog and
Network Topology all without loading it
  separately for each.

Additionally, JavaScript also allows for more advanced tools, such as the
Network Topology views (admittedly, they also require
a fair amount of work).

These are just some examples to illustrate the point. I'm sure other use
cases could be found.

[1]
https://github.com/openstack/horizon/blob/fa804370b11519fc261f73fa90177368fde679df/openstack_dashboard/api/neutron.py#L1066

po 16. 9. 2019 v 10:43 odesílatel Radomir Dopieralski <
openstack at sheep.art.pl> napsal:

> You seem to be missing the point. The alternative to Angular is not
> JQuery, it's a proper implementation on the server-side, both in the APIs
> (for pagination and filtering) and Horizon itself. Slapping JavaScript on
> top of it, whether it's Angular or JQuery, won't improve the situation.
>
> On Wed, Sep 11, 2019 at 5:21 PM Marek Lyčka <marek.lycka at ultimum.io>
> wrote:
>
>> Hi all,
>>
>> > We can't review your patches, because we don't understand them. For the
>> patches to be merged, we
>> > need more than one person, so that they can review each other's patches.
>>
>> Well, yes. That's what I'm trying to address. Even if another person
>> appeared to review
>> javascript code, it wouldn't change anything unless he had +2 and +W
>> rights though. And even then,
>> it wouldn't be enough, because two +2 are currently expected for the CR
>> process to go ahead.
>>
>> > JavaScript is fine. We all know how to write and how to review
>> JavaScript code, and there doesn't
>> > have to be much of it — Horizon is not the kind of tool that has to bee
>> all shiny and animated. It's a tool
>> > for getting work done.
>>
>> This isn't about being shiny and animated though. This is about basic
>> functionality, usability and performance.
>> I did some stress testing with large datasets [1], and the
>> non-angularized versions of basic functionality like
>> sorting, paging and filtering in table panels are either non-existent,
>> not working at all or basically unusable
>> (for a multitude of reasons).
>>
>> Removing them would force reimplementations in pure JQuery and I strongly
>> suspect that those
>> implementations would be much messier and cost a considerable amount of
>> time and effort.
>>
>> >AngularJS is a problem, because you can't tell what the code does just
>> by looking
>> >at the code, and so you can neither review nor fix it.
>>
>> This is clearly a matter of opinion. I find Angular code easier to deal
>> with than JQuery spaghetti.
>>
>> > There has been a lot of work put into mixing Horizon with Angular, but
>> I disagree that it has solved problems,
>> > and in fact it has introduced a lot of regressions.
>>
>> I'm not saying the NG implementations are perfect, but they mostly work
>> where it counts and can be improved
>> where they do not.
>>
>> > Just to take a simple example, the translations are currently broken
>> for en.AU and en.GB languages,
>> > and date display is not localized. And nobody cares.
>>
>> It's difficult for me to judge which features are broken in NG and how
>> much interest there is in having them
>> fixed, but they can be fixed once reported. What I can say for sure is
>> that I keep hitting this issue
>> because of actual feature requests from actual users. See [2] for an
>> example. I'm not sure implementing
>> that in pure JQuery would be nearly as simple as it was in Angular.
>>
>> > We had automated tests before Angular. There weren't many of them,
>> because we also didn't have much
>> > JavaScript code. If I remember correctly, those tests were ripped out
>> during the Angularization.
>>
>> Fair enough.
>>
>> > Arguably, improvements are, on average, impossible to add to Angular
>>
>> I disagree. Yes, pure JQuery is probably easier when dealing with very
>> simple things, but once feature
>> complexity increases beyond the basics, you'll very quickly find the
>> features offered by the framework
>> relevant - things like MVC decoupling, browser-side templating, reusable
>> components, functionality injection etc.
>> Again, see [2] for an example.
>>
>> On a side note, some horizon plugins (such as octavia-dashboard) use
>> Angular extensively. Removing it
>> would at the very least break them.
>>
>> Whatever the community decision is though, I feel like it needs to be
>> made so that related issues
>> can be addressed with a reasonable expectation of being reviewed and
>> merged.
>>
>> [1] Networks, Roles and Images in the low thousands
>> [2] https://review.opendev.org/#/c/618173/
>>
>> pá 6. 9. 2019 v 18:44 odesílatel Dale Bewley <dale at bewley.net> napsal:
>>
>>> As an uninformed user I would just like to say Horizon is seen  _as_
>>> Openstack to new users and I appreciate ever effort to improve it.
>>>
>>> Without discounting past work, the Horizon experience leaves much to be
>>> desired and it colors the perspective on the entire platform.
>>>
>>> On Fri, Sep 6, 2019 at 05:01 Radomir Dopieralski <openstack at sheep.art.pl>
>>> wrote:
>>>
>>>>
>>>>
>>>> On Fri, Sep 6, 2019 at 11:33 AM Marek Lyčka <marek.lycka at ultimum.io>
>>>> wrote:
>>>>
>>>>> Hi,
>>>>>
>>>>> > we need people familiar with Angular and Horizon's ways of using
>>>>> Angular (which seem to be very
>>>>> > non-standard) that would be willing to write and review code.
>>>>> Unfortunately the people who originally
>>>>> > introduced Angular in Horizon and designed how it is used are no
>>>>> longer interested in contributing,
>>>>> > and there don't seem to be any new people able to handle this.
>>>>>
>>>>> I've been working with Horizon's Angular for quite some time and don't
>>>>> mind keeping at it, but
>>>>> it's useless unless I can get my code merged, hence my original
>>>>> message.
>>>>>
>>>>> As far as attracting new developers goes, I think that removing some
>>>>> barriers to entry couldn't hurt -
>>>>> seeing commits simply lost to time being one of them. I can see it as
>>>>> being fairly demoralizing.
>>>>>
>>>>
>>>> We can't review your patches, because we don't understand them. For the
>>>> patches to be merged, we
>>>> need more than one person, so that they can review each other's patches.
>>>>
>>>>
>>>>> > Personally, I think that a better long-time strategy would be to
>>>>> remove all
>>>>> > Angular-based views from Horizon, and focus on maintaining one
>>>>> language and one set of tools.
>>>>>
>>>>> Removing AngularJS wouldn't remove JavaScript from horizon. We'd still
>>>>> be left with a home-brewish
>>>>> framework (which is buggy as is). I don't think removing js completely
>>>>> is realistic either: we'd lose
>>>>> functionality and worsen user experience. I think that keeping Angular
>>>>> is the better alternative:
>>>>>
>>>>> 1) A lot of work has already been put into Angularization, solving
>>>>> many problems
>>>>> 2) Unlike legacy js, Angular code is covered by automated tests
>>>>> 3) Arguably, improvments are, on average, easier to add to Angular
>>>>> than pure js implementations
>>>>>
>>>>> Whatever reservations there may be about the current implementation
>>>>> can be identified and addressed, but
>>>>> all in all, I think removing it at this point would be
>>>>> counterproductive.
>>>>>
>>>>
>>>> JavaScript is fine. We all know how to write and how to review
>>>> JavaScript code, and there doesn't
>>>> have to be much of it — Horizon is not the kind of tool that has to bee
>>>> all shiny and animated. It's a tool
>>>> for getting work done. AngularJS is a problem, because you can't tell
>>>> what the code does just by looking
>>>> at the code, and so you can neither review nor fix it.
>>>>
>>>> There has been a lot of work put into mixing Horizon with Angular, but
>>>> I disagree that it has solved problems,
>>>> and in fact it has introduced a lot of regressions. Just to take a
>>>> simple example, the translations are currently
>>>> broken for en.AU and en.GB languages, and date display is not
>>>> localized. And nobody cares.
>>>>
>>>> We had automated tests before Angular. There weren't many of them,
>>>> because we also didn't have much JavaScript code.
>>>> If I remember correctly, those tests were ripped out during the
>>>> Angularization.
>>>>
>>>> Arguably, improvements are, on average, impossible to add to Angular,
>>>> because the code makes no sense on its own.
>>>>
>>>>
>>>>
>>
>> --
>> Marek Lyčka
>> Linux Developer
>>
>> Ultimum Technologies s.r.o.
>> Na Poříčí 1047/26, 11000 Praha 1
>> Czech Republic
>>
>> marek.lycka at ultimum.io <stanislav.ulrych at ultimum.io>
>> *https://ultimum.io <https://ultimum.io/>*
>>
>

-- 
Marek Lyčka
Linux Developer

Ultimum Technologies s.r.o.
Na Poříčí 1047/26, 11000 Praha 1
Czech Republic

marek.lycka at ultimum.io <stanislav.ulrych at ultimum.io>
*https://ultimum.io <https://ultimum.io/>*
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstack.org/pipermail/openstack-discuss/attachments/20190918/d406cbfd/attachment.html>


More information about the openstack-discuss mailing list