moretti

Thanks to the Vite team for building a faster, modern bundling solution on a fully open source stack that isn't tied to a specific framework...cough cough, Turbopack

It looked okay until I scrolled down to the browser compatibility table and had to tilt my head to read the vertical text

Can anyone confirm if the final build number is the same as 12.0.1 RC2 (21A559)? You can run `$ sw_vers` from the CLI to check it.

I use Copilot mostly as replacement for intellisense and macros. It helps me automating repetitive tasks. I would never trust Copilot for an algorithm or a snippet, I mean I would treat the code just like anything taken from StackOverflow or Github.

yarn 2 solved real problems with zero install and advanced PnP. Maybe the only problem was that it was released too early, wasn't mature enough when it came out. Now it's just better than v1 and npm, works particularly well on large mono repos where upgrading a package can often break other modules due to how node_modules hoisting works.

it has a microSD card slot: https://www.steamdeck.com/en/tech

They slow down the phone after an unexpected shutdown, when the battery is unable to deliver the necessary peak power.

By declaratively I mean that in React you typically declare how an element should be render given the current (props, [state]).

For example, in vanilla JS, you might have something like:

  const btn = document.createElement('button');
  btn.className = 'btn red';
  btn.onclick = function(event) {
   if (this.classList.contains('red')) {
     this.classList.remove('red');
     this.classList.add('blue');
   } else {
     this.classList.remove('blue');
     this.classList.add('red');
   }
  };

  class Button extends React.Component {
    state = { color: 'red' }
    handleChange = () => {
      const color = this.state.color === 'red' ? 'blue' : 'red';
      this.setState({ color });
    }
    render() {
      return (<div>
        <button 
           className=`btn ${this.state.color}`
           onClick={this.handleChange}>
        </button>
      </div>);
    }
  }

It’s interesting that you find this “simpler”. One of the great advantages of React is that is declarative, it’s easy to understand how a component will render given a set of (props, state). Your example is quite the opposite, the render method violates this principle and each event handler manipulates the DOM using a ref. I’d call this spaghetti-React.

Redux is not an implementation of Flux. These two blog posts explain the main differences: https://code-cartoons.com/a-cartoon-guide-to-flux-6157355ab2... https://code-cartoons.com/a-cartoon-intro-to-redux-3afb77550...

This is also a really good resource: https://github.com/thejameskyle/the-super-tiny-compiler

https://twitter.com/domenic/status/721796970197684224

I'm not a number, I'm a free man!

Yeah https://twitter.com/sindresorhus/status/669958889941639168

In npmcdn the author of the package has to manually include the UMD build of the library.

You still have to simulate named arguments with an object:

    const foo = ({ a = 2, b = 2, c = 3 } = {}) => a * b * c;
    const dict = {b: 4, c: 6};

    foo(); // 12
    foo(dict); // 48

Reminds me of this tweet:

https://twitter.com/capotej/status/647213485294616576

You're probably not familiar with Atwood's Law[0]:

Any application that can be written in JavaScript, will eventually be written in JavaScript

[0] http://blog.codinghorror.com/the-principle-of-least-power/

Cool, that looks really interesting...

Embed CSS on any website! ;-)

How do you specify npm dependencies. Does it "automagically" inspect your `require` statements?

So Safari is holding back webdev because it doesn't support an experimental technology?

Fun thing: the author of the Selection API draft works for Apple :-)

http://www.w3.org/TR/selection-api

Here's another Python 3 compatible implementation: https://github.com/cdjc/goto

Actually, if you leave off the "new" you get a TypeError:

    TypeError: Class constructors cannot be invoked without 'new'

How a polymer component would be better than a react component?

Exactly, and you can't simply set a left margin because the scrollbar width is different in every OS. This is what bootstrap does: https://github.com/twbs/bootstrap/blob/83bfff7f0765503b990b9...

http://www.quirksmode.org/blog/archives/2009/09/the_html5_dr...

Related: http://stackoverflow.com/questions/8479058/how-do-i-find-wal... http://stackoverflow.com/questions/8849869/how-do-i-find-wal...

Here's another great comparison: https://github.com/MicheleBertoli/css-in-js

I think that css-modules (implemented in webpack's css-loader) is the sanest approach: https://medium.com/seek-ui-engineering/the-end-of-global-css...

We've been using inline styles in our main project (built with React), but we recently deciced to move to css modules:

https://github.com/css-modules/css-modules

https://medium.com/seek-ui-engineering/the-end-of-global-css...

Inline styles are great, but they don't support basic features such as pseudo classes/elements, so even implementing simple components like buttons was cumbersome.

With latest version of webpack's css loader you get css scoping (you no longer need to add lengthy prefixes to all selectors) and you can also use additional loaders for post-processing your styles (we use a lot of postcss plugins such as autoprefixer).

Have a look at this example:

https://github.com/css-modules/webpack-demo

And here's a great comparison of the main CSS in JS techniques:

https://github.com/MicheleBertoli/css-in-js

The next step is submit HN to HN.