TLDR; This post discusses the design decisions of Underreact What i

Awesome write-up, <a class="user-mention notranslate" data-hovercard-type="user" data-

<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/us

<a class="user-mention notranslate" data-hovercard-type="user" data-hover

Underreact Design about underreact HOT 7 CLOSED

mapbox commented on July 23, 2024 2

Underreact Design

from underreact.

Comments (7)

davidtheclark commented on July 23, 2024

Awesome write-up, @kepta! Just two follow-up questions for you:

Do you think it's necessary to pass renderJsBundles and renderCssLinks functions into the HTML-rendering function, or do you think we'd serve our use cases by automatically injecting those things (at the end of </body> and </head>, respectively)?
What do you think about the HTML-rendering function returning either a string or a Promise that resolves with a string?

from underreact.

davidtheclark commented on July 23, 2024

@kepta What do you think our polyfill strategy should be?

from underreact.

kepta commented on July 23, 2024

Do you think it's necessary to pass renderJsBundles and renderCssLinks functions into the HTML-rendering function, or do you think we'd serve our use cases by automatically injecting those things (at the end of and , respectively)?

I don't see any benefit in auto injecting them behind the scenes. On a plus side, pro-users would be happy to take command over the placement.

What do you think about the HTML-rendering function returning either a string or a Promise that resolves with a string?

Oops, I forgot to mention that, thanks for reminding. (updated the ticket)

from underreact.

kepta commented on July 23, 2024

@kepta What do you think our polyfill strategy should be?

@davidtheclark getting inspired by webpack, I propose that we use a default polyfill file and provide a polyfillInject() function in our async HTML-rednering function:

{
  htmlSource: ({ renderJsBundles, polyfillInject , renderCssLinks }) => `
      <html>
      <head>
       <title>Words that rhyme with fish</title>
         ${polyfillInject()}
        <link href="https://api.mapbox.com/mapbox-assembly/v0.21.2/assembly.min.css" rel="stylesheet">
        ${renderCssLinks()}
      </head>
      <body>
        <div id="app">
          <!-- React app will be rendered into this div -->
        </div>
        ${renderJsBundles()}
      </body>
      </html>
    `;
}

This polyfillInject function would do something similar to what webpack proposes, that is

  var modernBrowser = (
    'fetch' in window &&
    'assign' in Object
  );

  if ( !modernBrowser ) {
    var scriptElement = document.createElement('script');

    scriptElement.async = false;
    scriptElement.src = '/polyfills.bundle.js';
    document.head.appendChild(scriptElement);
  }

Thoughts?

from underreact.

davidtheclark commented on July 23, 2024

I don't see any benefit in auto injecting them behind the scenes.

The benefit would be that if it's always done in exactly the same way, you don't have to repeat the boilerplate every time. I wasn't sure about those functions any more because I couldn't think of any use cases for doing anything different with them: in every case, you should put the links at the end of </head> and the scripts at the end of </body>. Can you think of use cases for using those functions in any other way?

Interesting idea for polyfilling. So we'll need to decide which polyfills to include and what modernBrowser test covers them all sufficiently.

from underreact.

kepta commented on July 23, 2024

Can you think of use cases for using those functions in any other way?

I think the functions provide a transparent way of templating the html. But if we are never gonna change their order we can possibly do them behind the scene.

So we'll need to decide which polyfills to include and what modernBrowser test covers them all sufficiently.

Ya we will need a default list of polyfills, I wonder if the browserslist can help us with that?

from underreact.

kepta commented on July 23, 2024

Underreact was released 🎉 !

from underreact.

Underreact Design about underreact HOT 7 CLOSED

Comments (7)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent