5 ms·

The Vue/Angular demo files make use of `new Proxy()`. To the devs knowing these frameworks: is that best practice, or asked differently, are these representativ

The Vue/Angular demo files make use of `new Proxy()`. To the devs knowing these frameworks: is that best practice, or asked differently, are these representative examples?

JimDabell 2y ago
Vue switched to proxies in v3. They haven’t had great browser support for a very long time, and if I remember correctly, polyfilling them was difficult.
- whizzter 2y ago
  Yeah, the Vue-like I made (other comment) was my second attempt at it and this time using just Proxy to simplify things. The first time I had tried to do it as Vue did previously with defineProperty but it was a damn mess to try to support arrays,etc and honestly the code was never stable (and using Vue V2 you can also run into a few edge-cases like missing properties missing reactivity).
- wg0 2y ago
  Svelte 5 too.
- throwitaway1123 2y ago
  Yeah Vue 2 used object getters and setters, and there were a few tricky caveats. For example, setting an array item using an index wouldn't trigger the setters (e.g. `myArray[0] = ''`). You had to remember these edge cases and use `Vue.set` [1]. Proxies made everything so much simpler, but they can't really be polyfilled at all, because they require deep JS engine integration (e.g. to register a callback that gets notified whenever a property is added to an object). [1] https://v2.vuejs.org/v2/guide/reactivity.html https://v2.vuejs.org/v2/guide/reactivity.html
martypitt 2y ago
No, these aren't representative examples of how you would use Angular. Angular code wouldn't use any of these techniques: - the use of Proxy() - calling compile(), - using a querySelector to bind elements - Manually wiring up click handlers But, I'm not sure that's what the author is trying to do -- I think they're trying to show what is going on under the hood, coded in pure JS. In that context, it's probably relevant to show this (assuming it's indicative of what Angular actually does -- of that I'm less sure)
tobr 2y ago
Proxies work across all mainstream browsers. Only the rare IE holdout would be a problem.
- punduk 2y ago
  There are probably still people here who use IE or browsers whose names no one remembers and only 3 people in the world use.
  - Vinnl 2y ago
    I'm fairly sure there are more people with various accessibility needs, so we can start worrying about those once everything is fully accessible.
  - exe34 2y ago
    it's the same three people though, and they're happy to support it themselves!
  - red_admiral 2y ago
    Hey, elinks still works just fine inside tmux over an ssh connection. Less hassle than getting the VPN running correctly if I just want to read a company intranet wiki page.
- esperent 2y ago
  Not sure why you're getting downvotes because you are correct. https://caniuse.com/proxy https://caniuse.com/proxy
- yowzadave 2y ago
  I have an old MacBook Air that my daughter uses for school; it doesn’t support the evergreen version of MacOS/Safari, or Firefox or Chrome. I think Proxies have been around long enough that they are supported…but I’m waiting for the day that she can no longer use a browser on that machine, at which point I’ll either have to buy her a new one, or install some flavor of Linux. It’s a shame because the computer itself is totally serviceable!
Tade0 2y ago
I think the author is trying to briefly show how internals of these frameworks are designed. My framework of choice is Angular and the example is somewhat accurate, even if it shows just a small slice of the system. Indeed Angular components start off with a compilation step (which doesn't have to be done entirely at runtime) and there's a system in place to react to data changes and events in the template - can't confirm whether it's using Proxies though. But there's also a whole change detection system which reacts to event listeners firing, HTTP requests, timeouts etc. and decides which components to update and how. Nowadays there are also signals, which add another layer on top of all that. Overall Angular's internals are a massively complicated beast and few people have a good grasp of them (I've met some - would not recommend doing what they were doing). Net effect is that its development as a framework is slow. Personally I see it as a feature.

The Vue/Angular demo files make use of `new Proxy()`. To the devs knowing these frameworks: is that best practice, or asked differently, are these representative examples?

JimDabell 2y ago

Vue switched to proxies in v3. They haven’t had great browser support for a very long time, and if I remember correctly, polyfilling them was difficult.

whizzter 2y ago
Yeah, the Vue-like I made (other comment) was my second attempt at it and this time using just Proxy to simplify things. The first time I had tried to do it as Vue did previously with defineProperty but it was a damn mess to try to support arrays,etc and honestly the code was never stable (and using Vue V2 you can also run into a few edge-cases like missing properties missing reactivity).
wg0 2y ago
Svelte 5 too.
throwitaway1123 2y ago
Yeah Vue 2 used object getters and setters, and there were a few tricky caveats. For example, setting an array item using an index wouldn't trigger the setters (e.g. `myArray[0] = ''`). You had to remember these edge cases and use `Vue.set` [1]. Proxies made everything so much simpler, but they can't really be polyfilled at all, because they require deep JS engine integration (e.g. to register a callback that gets notified whenever a property is added to an object). [1] https://v2.vuejs.org/v2/guide/reactivity.html https://v2.vuejs.org/v2/guide/reactivity.html

martypitt 2y ago

No, these aren't representative examples of how you would use Angular. Angular code wouldn't use any of these techniques: - the use of Proxy() - calling compile(), - using a querySelector to bind elements - Manually wiring up click handlers But, I'm not sure that's what the author is trying to do -- I think they're trying to show what is going on under the hood, coded in pure JS. In that context, it's probably relevant to show this (assuming it's indicative of what Angular actually does -- of that I'm less sure)

tobr 2y ago

Proxies work across all mainstream browsers. Only the rare IE holdout would be a problem.

punduk 2y ago
There are probably still people here who use IE or browsers whose names no one remembers and only 3 people in the world use.
- Vinnl 2y ago
  I'm fairly sure there are more people with various accessibility needs, so we can start worrying about those once everything is fully accessible.
- exe34 2y ago
  it's the same three people though, and they're happy to support it themselves!
- red_admiral 2y ago
  Hey, elinks still works just fine inside tmux over an ssh connection. Less hassle than getting the VPN running correctly if I just want to read a company intranet wiki page.
esperent 2y ago
Not sure why you're getting downvotes because you are correct. https://caniuse.com/proxy https://caniuse.com/proxy
yowzadave 2y ago
I have an old MacBook Air that my daughter uses for school; it doesn’t support the evergreen version of MacOS/Safari, or Firefox or Chrome. I think Proxies have been around long enough that they are supported…but I’m waiting for the day that she can no longer use a browser on that machine, at which point I’ll either have to buy her a new one, or install some flavor of Linux. It’s a shame because the computer itself is totally serviceable!

Tade0 2y ago

I think the author is trying to briefly show how internals of these frameworks are designed. My framework of choice is Angular and the example is somewhat accurate, even if it shows just a small slice of the system. Indeed Angular components start off with a compilation step (which doesn't have to be done entirely at runtime) and there's a system in place to react to data changes and events in the template - can't confirm whether it's using Proxies though. But there's also a whole change detection system which reacts to event listeners firing, HTTP requests, timeouts etc. and decides which components to update and how. Nowadays there are also signals, which add another layer on top of all that. Overall Angular's internals are a massively complicated beast and few people have a good grasp of them (I've met some - would not recommend doing what they were doing). Net effect is that its development as a framework is slow. Personally I see it as a feature.