1. vue
Vue.js is a JavaScript framework based on the MVVM pattern. Through its concise, efficient syntax and powerful functions, it helps developers build more flexible, fast and maintainable web applications. Compared with other frameworks, Vue is different from the complicated ones in the market. It focuses on the advantages of ease of use and quick use, and provides developers with greater freedom. Whether it's used to build simple personal projects or complex enterprise-level applications, Vue can do it.
The birth of Vue3 stems from the comprehensive consideration of user feedback and technical challenges. As a major upgrade, Vue3 has taken an important step forward in terms of performance, development experience and collaboration capabilities. The JNPF rapid development platform is currently updated to the latest Vue3 version.
2. Using Vue
JNPF is an excellent domestic development platform. It adopts Java+.net dual technology engine. In recent years, it has been outstanding in terms of market performance and product competitiveness. It separates the front and rear frameworks (SpringBoot+Mybatis-plus+Ant-Design+Vue3). The code generator has low dependence, flexible expansion capability, and can flexibly realize secondary development.
The platform encapsulates charts or page elements as basic components, which can fulfill business requirements without writing code. Meet the comprehensive capabilities of rapid system development, flexible expansion, seamless integration and high-performance applications;
In order to support application development with higher technical requirements, from database modeling, Web API construction to page design, there is almost no difference from traditional software development. The platform encapsulates charts or page elements as basic components, and can complete business requirements without writing code.
It is worth mentioning that the Vue3 version of the JNPF rapid development platform is based on the background solutions of Vue3.x, vue-router4.x, Vite4.x, Ant-Design-Vue3.x, TypeScript, pinia, and less, using the pnpm package Management tools, whether in small projects or huge enterprise-level applications, we can rely on this powerful technology stack to quickly build high-quality applications.
Features:
JNPF is an efficient drag-and-drop low-code data visualization development platform, which encapsulates charts or page elements as basic components, and can create large data screens without writing code, reducing mental burden.
Related Links: www.jnpfsoft.com/?csdn
Technical points:
- Framework: Based on the Vue3 framework, it is lightweight, easy to use, and can have a concise API to provide efficient data binding and a flexible component system.
- Type: Use TypeScript for type constraints, reduce the probability of unknown errors, and boldly modify the logic content; this feature makes team collaboration more efficient and reduces the cost of maintaining code.
- Performance: multiple performance optimizations, use page lazy loading, component dynamic registration, data scrolling loading, etc. to improve page rendering speed;
The latest technology:
Based on the Vue3 & TypeScript framework, the code structure is clearer, and the pnpm package management tool is used.
Complete functions:
Provide project control, global control, component basic configuration, animation configuration, request configuration, event configuration, etc.
Rich components:
It has rich content components, built-in 60+ component content, and is constantly being updated and upgraded.
Core functions:
Form engine, visualization engine, BI engine, process engine, authority engine, portal engine, large screen engine, interface center, IoT platform
biggest advantage:
Provide 100% source code and support private deployment (local deployment)
3. Introduction to the advantages of using Vue3 in the low-code front-end framework
- Lightweight, easy to use, and can have a concise API to provide efficient data binding and a flexible component system
- Components are one of the most powerful features of Vue. Components can extend HTML elements and encapsulate reusable code.
- The implementation of two-way data binding is easier to operate DOM (vue.js) uses the object.defineProperty method to monitor the operation of the other party's data, so that data synchronization can be automatically triggered, and changes can be accurately sent to the bound view instead of All data is detected once (unlike angular.js).
- Vue is a single-page application; it makes the page refresh partially, and does not require all data and DOM to be requested every time the page is jumped.
- Vue adopts virtual DOM, and no longer uses native dom operation nodes, which greatly liberates dom operations, but the specific operation is still dom, but it is another way.
Advantage expansion: (specific advantages)
1. Responsive performance improvement
Performance is 1.2-2 times faster than Vue2. The performance improvement is mainly achieved through the improvement of the responsive system (vue3 uses the proxy object to rewrite the responsive system) and compilation optimization (optimizing compilation and rewriting virtual dom, optimizing the diff algorithm).
2. Smaller code size
Vue3 compiles on demand, and the overall size becomes smaller. In addition to removing some uncommon APIs, it is worth mentioning that any function of Tree Shanking, such as ref, reactive, computed, etc., is only packaged when it is used. Unused modules are removed, and the overall volume of the package becomes smaller. Small.
3. Support composition API (Composition Api);
Vue2 uses Options Api (option api), while Vue3 uses Composition Api (combination api).
①Options Api：
The regulations are clear, and the same things are placed in the same place; but as the function of the component increases, the relevance will be greatly reduced, and the difficulty of reading and understanding the component will increase;
②Composition Api：
Components are organized according to logical functions. All APIs defined by a function will be put together (higher cohesion and lower coupling). Even if the project is large and has many functions, we can quickly locate the functions used by this function. All APIs.
4. Better ts support
Vue has added the DefineComponent function to enable components to better use parameter type inference under ts. Such as: reactive and ref are very representative.
5. More advanced components
①Vue does not need a root node, and multiple elements or tags can exist side by side.
②You can add the content in the teleport to any node, which is definitely a boon for deeply nested components.
③Allowing the program to render some backup content while waiting for the asynchronous component allows us to create a smooth user experience.