Code completion, GUI designers and all sorts of fancy features already existed in IDEs 20 years ago.
You claim you have gained productivity, but coding a business app as a webpage or as an Electron app is not any faster than making it in VB6 or Delphi was. And the language were designed designed than JavaScript.
For example if a function in a library I'm using is called `createUserWithSubscription`, and I start typing `usersub` anywhere in the project, it should offer that function near or at the top of the suggestion list, even if its location is not already imported/included in my current file. Things like that have a huge impact on easy discoverability of a library's functionality, which in turn has a huge impact on productivity and speed of adopting new technology.
If I just press Ctrl+space while the cursor is inside a function call, without typing anything, it should offer suggestions based on what other code passes into that function, or suggestions based on the type of the argument, etc. I don't recall these things from 20 years ago. And that is still just one of the features.
>coding a business app as a webpage or as an Electron app is not any faster than making it in VB6 or Delphi was
I would say it is. Of course the apps made today are very different from the apps back then, but making UI that displays data is much easier.
> Of course the apps made today are very different from the apps back then, but making UI that displays data is much easier.
How so? Both VB6 and Delphi were designed to display and edit data quickly. Its main use case was creating business apps very quickly and both had WYSIWYG GUI designers in the IDE itself!
There were menus, buttons, lists, tables, tree displays, rich-text editors and many other ready-to-use controls. You had adaptors for different databases, OLE for embedded documents, COM support, etc. You could display images, video, sound too. Even commercial games were developed on them.
Instead of just doing
<>
<h1>List of items</h1>
{items
.filter(itemFilter)
.map(item => <div>
{/* UI for the individual item, e.g. name,
subtitle, icon, buttons, etc. */ }
</div>)}
</>
Networked apps, business apps, database frontends, etc. have been a thing since the 80’s, and I am not even talking about that but IDEs from the 90’s and later.
The code you show is identical to what was done back then in many languages, many frameworks and many systems. Filtering, sorting, per-item UI, multi-views, synchronization, etc. has been always a basic need.
The web is yet another UI/app framework. Nothing less, nothing more.
For exapmle in Qt you have to either subclass QAbstractListModel or use QStandardItemModel with weird QStandardItem wrappers around your data, then you have QSortFilterProxyModel (https://doc.qt.io/qt-5/qsortfilterproxymodel.html) and all that weirdness. And then for the actual UI of the individual items, you have QAbstractItemDelegate, etc. https://doc.qt.io/qt-5/qabstractitemdelegate.html
I mean, just look at this example: https://doc.qt.io/qt-5/qtwidgets-itemviews-stardelegate-exam...
No way that should take that much code.
The web is actually one of the most complex ones out there due to the never ending frameworks and libraries that come into fashion every other year. Old environments had a defined set of things to use and learn and things were stable for many years.
In Qt you can build your UI on the fly with code without using those classes if that is what you are asking.
https://codesandbox.io/s/eloquent-spence-d51td?file=/src/App...
in Qt or one of the "old school" desktop tools as quickly as I just did in a few minutes, that loads data from the web (mock) and displays them in this way (and has this level of flexibility for further development). There's just no way.
You don't have to wrap it in models like this https://doc.qt.io/qt-5/qtquick-modelviewsdata-modelview.html and then either recalculate that when the data changes or have a custom model class that does it. Though granted that is still a huge improvement over doing this in regular Qt Widgets (see the star example a few comments above), or one of the "old school" desktop GUI builders. This difference would be felt even more if the items also had some interactivity with state (e.g. expanded/collapsed things in them, lazy loaded extra info etc.)
One consequence of the way rendering works is that I can just use language-native constructs like `if` or the ternary operator to either include or not include the "Top poster" line in the example. Instead of having to do something like this https://stackoverflow.com/questions/27695717/conditionally-i.... Similarly, you can use map/filter on arrays, transform the data more easily before rendering it, etc.
Another difference is that JS/TS is the main language of the entire app, not a separate DSL that you can use for some parts and not for others. You can use async/await, have the entire npm ecosystem available, etc.
Though QML is still hell of a lot better in this regard than old school VB or Delphi used to be.