Nue JS, the new front-end wheel, claims to create a new Web ecosystem! ! !

Table of contents

What is Nue JS?

Build user interfaces with less code

built to scale

decoupled style

Reactivity and isomorphism

UI library file

simpler tools

Example

Article references


What is Nue JS?

Nue JS is a very small (2.3kb minified) JavaScript library for building web interfaces. It is the core of the upcoming Nue ecosystem. It's like Vue.js, React.js or Svelte, but without the abstract concepts of hooks, effects, props, portals, watchers, provides, injects, suspension. Understand the basics of HTML, CSS, and JavaScript and you're good to go.

Build user interfaces with less code

According to the author, the biggest benefit of Nue is that you need less code to accomplish the same thing:

The same listBox component reactrequires 2537 lines, vue1913 lines, and svelte1286 lines. Nue only requires 208 lines, which is react10 times smaller.

built to scale

Three reasons why Nue scales so well:

  1. Separation of concerns , easy-to-understand code is easier to extend than "spaghetti code"
  2. Minimalism , a hundred lines of code is easier to scale than a thousand lines of code
  3. Talent separation , when UX developers focus on front-end and JS/TS developers focus on front-end and back-end, the team skills will be optimally balanced:

decoupled style

Nue does not advocate the use of Scoped CSS, style properties, Tailwind or other CSS-in-JS gymnastics:

  1. More reusable code : When styles are not hard-coded into components, the same component may look different depending on the page or context.
  2. No spaghetti code : pure HTML or pure CSS is easier to read than mixed spaghetti code
  3. Faster page loads : By decoupling styles, it's easier to extract primary CSS from secondary CSS and keep HTML pages under the critical 14kb limit.

Reactivity and isomorphism

Nue has a rich component model, which allows you to create a variety of applications using different types of components:

  1. Server components are rendered on the server. They help you build content-centric websites that load faster without JavaScript and are crawlable by search engines.
  2. Reactive components are rendered on the client side. They help you build dynamic islands or single-page applications.
  3. Hybrid components are partially rendered on the server side and partially on the client side. These components help you build responsive, SEO-friendly components such as video tags or image galleries.
  4. Common components are used the same way on both server and client sides.

UI library file

Nue allows you to define multiple components on a single file. This is a great way to group related components together and simplify dependency management.

simpler tools

Nue JS comes with a simple renderserver-side rendering feature and a compilefeature for generating components for the browser. There is no need for complex bundlers such as Webpackor to control your development environment. ViteJust Nueimport into your project.

If your application becomes more complex due to a large number of dependencies, you can use a packager on your business model. Bunand esbuildare great high-performance options.

Nue JS is a versatile tool that supports both server-side and client-side rendering, helping you build content-centric websites and reactive single-page applications.

  1. UI Library Development : Create reusable components for reactive front-ends or server-generated content.
  2. Progressive Enhancement : Nue JS is a perfect micro-library to enhance content-centric websites with dynamic components or "islands"
  3. Static Website Generator : Just import it into your project and it's ready to render. No bundler required.
  4. Single Page Applications : Build simpler, more scalable applications with the upcoming Nue MVC project.
  5. Template Nue : is a universal tool for generating websites and HTML emails.

Article references

Guess you like

Origin blog.csdn.net/weixin_52630329/article/details/133163104