Hacker News new | past | comments | ask | show | jobs | submit | jpangs88's comments login

It seems to work okay as in you can use them: https://reactjs.org/docs/web-components.html

But it is not fully integrated with react, you have to do some work for interaction: https://www.sitepen.com/blog/wrapping-web-components-with-re...

That link is a few years old though I think the principle is the same.


At my work web components were purposed recently for creating a ui component library of which I was skeptical. On the whole I was skeptical of web components viability and future but this post relieves some of that tension.

The other thing I was worried about was that it was planned to after writing this web component lib, to wrap these components in React. Does anyone have any experience or insights into a React wrapped web component lib?


The Lit team has a labs project called @lit-labs/react that will automatically create a react wrapper:

https://www.npmjs.com/package/@lit-labs/react


It works alright with React if you treat it like regular DOM elements, but there's rough edges like SSR event handlers not working: https://github.com/facebook/react/issues/18390

Unfortunately it seems facebook isn't prioritizing fixing issues like this.

I'd suggest using preact if you want a framework that's more compatible with web components but gives you the React experience.


Super easy to incorporate with React. Just use react to pass attributes, like so:

    class App extends React.Component {
      render() {
        return (
          <my-component custom-attribute={value}></my-component>
        )
      }
    }
In your webcomponent just make sure you listen to changes to that attribute like so:

    static get observedAttributes() {
      return ['custom-attribute']
    }
Then you can decide how the component changes whenever that attribute is updated by using the `attributeChangedCallback` function. Alternatively, use a base element that incorporates a render() function which will automatically update everything in the shadowdom.

Main difference is it becomes much harder to pass complex data structures. Passing strings is easy, but passing an array of data isn't feasible with this model.


Issues arise when trying to pass objects or add event listeners for custom events due to how React specifically handles this stuff. You often have to use refs


And even refs aren't enough if the custom element does its initial render asynchronously. I had to add mutation observers to some wrappers to avoid polling the ref.current.


Wrapping React components in Web Components has limits you'll quickly hit. Suppose you have two components (in a parent/child relationship) that share context (e.g., you're wrapping react-beautiful-dnd in Web Components-- <Draggable /> and <Droppable />). Each component has it's own ReactDOM.render call, and therefore is its own React VDOM tree with no shared context.

So you can't take existing React libraries and 1:1 map them to web components. That approach only works for 'leaf' components that accept no children.


In a closed source project I worked for, we used wrapped web components as React components for a UI library. I cannot show something here, only the approach we have used for it: https://www.robinwieruch.de/react-web-components


I get frustrated by things like this, these walled gardens of people I know. I wish I could just switch to signal but I've found people would rather just not talk to me than download a new messenger app

I've settled for just talking to the people I can convince on different messengers and now have ~5 messenger apps on my phone.


I don't have a large friend group, but got most of them to switch after I left Facebook. I just don't tell people I have WA and only use it if I'm forced to. You might have better luck since Signal has improved a lot in the last 6 months and there is a good desktop app. But you might need better friends. Friends that might warn you about how your username suggests you're a Nazi (I assume this is unintentional and just your birthday year)[0]

[0] https://www.urbandictionary.com/define.php?term=88


I also thought the avatars looked creepy. I understand that this could be useful but is it more useful than MDN??? (Personally I don't think so).


I feel like node/Electron are about as safe as chromium and it's npm packages that have lost everyone's confidence.


Not exactly, the chromium/chrome sandbox isn’t dependent on how and what code you execute the electron/node one is and that is because the latter were designed to execute code across many more privilege levels than what “dedicated” browser needs.

If I download and build chromium (as long as I don’t disable the sandbox altogether) I don’t actually need to think about those issues while I do need to do that with Electron.


Is Chromium’s sandbox insecure?

Electron has local file access, etc. in fact, it states: “Under no circumstances should you load and execute remote code with Node.js integration enabled.”

So, Stealth should consider forking Electron if better sandboxing is needed.

https://www.electronjs.org/docs/tutorial/security

That doesn’t prevent it from being secure, though.


Vue is also making something similar in both name and function https://vueschool.io/articles/vuejs-tutorials/suspense-new-f... don't know about svelte...


So I very much agree with the sentiment I started writing a similar comment, but if you scroll down to the very last sentence (it's a bullet point) of the article it says that the author is not a senior engineer.


I feel that so many of these articles on Sweden fail to mention the reason for Sweden's strategy and often say it due to another reason. The reason that the Swedish government has given for the strategy is that they think that people can follow the restrictions long term. It's not to save the economy or to create heard immunity (which I have heard from many people.) I think it's too early to judge Sweden's strategy as presumably the intent is that things will be better down the line.

On a more personal note, I live in Sweden and I am not a Swedish citizen and I can say that things aren't "Business as usual here" and plenty is being done to stop the spread of the COVID 19. I can't say I 100% agree with the policy but I also don't think it's the huge mistake people make it out to be.

I have linked below an explanation for the strategy by one of Sweden's top epidemiologist and the one that's often credited as the architect of Sweden's strategy.

https://www.bloomberg.com/news/articles/2020-06-28/sweden-s-...

https://www.krisinformation.se/en/hazards-and-risks/disaster...


One thing I don't see discussed and it's an unbacked intuition is that all the different government strategies seem to revolve around differences in 'group' trust levels.

Both the Swedish 'no-lockdown' and the Dutch 'intelligent' lockdown are government policies that actually work locally because the government trusts that the population will follow the guidelines given (which they do for the majority).

Equally when I discussed with Dutch and Swedish people (anecdata) they all believed their national strategy was correct because they trusted their governaments competence and the science advisors that were being consulted.

I think many of these strategies cannot be translated to other countries were there isn't a shared trust level, i.e. population trusting the government's competence, and equally the government trusting civil society (biggest example being the US).


The favicons on the duckduckgo browser are often worse than other browsers in my opinion. For example the BBC website where DDG interestingly enough just uses /favicon.ico and the other browsers use the apple touch icon. (Information I found from just looking at the pages headers)

Don't really understand why they do extra work to get worse results... This feels to me slightly worse than just a privacy concern, it's a misunderstanding of their domain which leads me to the question of what else do they not fully understand.

The good news is that you can have the DDG search engine as a default in other browsers.

(I understand that the DDG browser is probably not their main focus and any lack of knowledge can potentially be just on their mobile browser.)


I was wrong about what this was I have edited this comment


Why would a Rust wrapper around the C++ project that is V8, which implements a garbage-collected programming language and environment, "use less ram" just by virtue of some parts of it being written in Rust?


Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: