Giter VIP home page Giter VIP logo

alova's Introduction

A lightweight request strategy library, which provides targeted request strategies for different request scenarios to improve application availability and fluency, reduce server pressure, and enable applications to have excellent strategic thinking like a wise man.

English | πŸ“‘δΈ­ζ–‡

npm build coverage status minzipped size dependency tree shaking typescript license

πŸ”₯Documentation

https://alova.js.org

πŸš€ Features

  • πŸŽͺ Interactive docs & demos
  • πŸ•Ά Support vue, react, svelte
  • 🦾 Real-time automatic status management
  • πŸ“‘ Similar api design to axios, easier
  • β–ͺ️ 4kb, only 30%+ of axios
  • πŸ‘„ Declarative Scenario Request
  • πŸ”© Flexible: Work with any request library like axios, superagent, or fetch-api
  • πŸ”‹ 3 response data caching modes
  • ✨ Interface data is pre-fetched in any case, which means users can see information faster
  • 🎈 Typescript support
  • πŸ–₯️ Offline submition
  • ⚑ Fully tree shakeable: Only take what you want, bundle size
  • πŸ”Œ Rich extension functions, you can customize request adapter, storage adapter, request middleware, states hook

Examples

The examples here will show the power of alova.

What relationship with request libraries

The original intention of alova is to propose a solution for different request scenarios. It can implement request functions with better experience and performance more concisely and elegantly. It is an RSM implementation library, such as $.ajax, axios and fetch-api. It provides good support for request sending and response receiving. They are an indispensable part of the RSM process (request event link), and alova still needs to rely on them for requests, so we can regard alova as a request library. An armament that makes the request library even more powerful.

Library Stability

It has been nearly a year since the development of the first version of alova. During this year, we have been continuously discovering and optimizing problems. So far, alova has passed 128 unit tests, with a coverage rate of 99%. Even so, alova is still a rookie, so I suggest you use it conservatively.

I promise to solve it as soon as possible after receiving your issue

We really need your star

If you like alova. we are very appreciate your star at the topright. it's a approval of our work.

Size comparison with other libraries

alova axios react-query vue-request vue react
minzip minzip minzip minzip minzip minzip

What is request scene model

We always have to think about the following questions when making a request,

  1. When is the request made;
  2. Whether to display the request status;
  3. Whether to encapsulate it into a request function for repeated calls;
  4. How to process the response data;
  5. Whether to cache frequently used response data;
  6. How to operate data across pages;
  7. Can I still submit data when I am offline?
  8. ...

fetch or axios tend to focus more on how to interact with the server, but we always need to deal with the above problems by ourselves. These functions that are beneficial to application performance and stability will always allow programmers to write low-maintenance functions. sexual code. The request scene management is to abstract all the links from the preparation of the request to the completion of the response data processing, so as to cover the model of the entire CS interaction life cycle from the perspective of the front end. alova is a request scene management library based on the request scene model. It is a supplement to the request library such as axios, not a replacement.

CS interaction: refers to all client types and server-side data interaction

RSM(Request scene model)

model

request timing

Describes when a request needs to be made, implemented as useHook in alova.

  • Initialize display data, such as just entering an interface or sub-interface;
  • Human-computer interaction triggers CS interaction, which requires changing data to re-issue requests, such as page turning, filtering, sorting, fuzzy search, etc.;
  • Pre-loading data, such as pre-loading the content of the next page in a pagination, predicting that the user clicks a button to pre-fetch data;
  • To operate server-side data, it is necessary to issue a request for addition, deletion and modification, such as submitting data, deleting data, etc.;
  • Synchronize the status of the server, such as polling requests in scenarios where data changes rapidly, and re-pulling data after operating a certain data;

Request behavior

Describes how to handle the request, implemented as a method instance in alova.

  • Placeholder request, displaying loading, skeleton diagram, or the last real data used when requesting;
  • Cache high-frequency responses, and execute requests multiple times will use fresh data;
  • Multi-request serial and parallel;
  • Anti-shake for frequent requests, avoid front-end data flashing, and reduce server pressure;
  • Important interface retry mechanism to reduce the probability of request failure caused by network instability;
  • Silent submit, when you only care about submitting data, directly respond to the success event after submitting the request, and the background ensures that the request is successful;
  • Offline submit, temporarily store the submitted data locally when offline, and submit it after network connection;

request event

Indicates that the request is sent with the request parameters, and the response is obtained. alova can cooperate with any request library or native solution such as axios, fetch, XMLHttpRequest.

Response data management

alova will state and manage the response data in a unified manner. The response data can be operated at any location, and the corresponding views can be automatically updated by using the characteristics of the MVVM library.

  • Remove the cached response data and pull it from the server when the request is made again;
  • Update cache response data, which can update response data at any location, which is very beneficial to update data across pages;
  • Refresh the response data, which can re-refresh the response data at any location, and is also very beneficial to update data across pages;
  • Custom setting cache, when requesting batch data, you can manually set the cache for batch data one by one, so as to satisfy the cache hit of subsequent single data;

Install

# use npm
npm install alova --save

# use yarn
yarn add alova

Usage

Usage is here

Official Ecosystem

Resources Description
@alova/mock Mock request adapter for alova.js
@alova/scene-react react request strategy library for alova.js
@alova/scene-vue vue request strategy library for alova.js
@alova/scene-svelte svelte request strategy library for alova.js
@alova/adapter-uniapp uniapp adapter for alova.js
@alova/adapter-taro taro adapter for alova.js
@alova/adapter-axios axios adapter for alova.js
@alova/adapter-xhr XMLHttpRequest adapter for alova.js

What is next?

Alova core

  • βœ… The storage time can be set as a date object, indicating that it expires at a certain point in time
  • βœ… You can set the default cache for different request methods globally. The current default is 500 seconds of memory cache for GET requests
  • βœ… Additional state management, get and update additional state across pages and modules
  • request error log printing
  • βœ… Complete offline submission function, you can submit when you are offline, and you can read offline information when you enter again
  • βœ… Request middleware design, which can manually control sending requests, status modification, etc.
  • βœ… Retry interval, maximum number of retries, etc. when silent submission fails
  • βœ… Request to share
  • Server-side rendering support
  • Performance improvements

Extensions

  • βœ… Adapters for each operating environment (Uniapp, Taro)
  • Develop extended hooks under different request scenarios through alova/scene library, providing out-of-the-box high-performance and high-experience functions [Refer to usePagination ]

Contribution Guide

Please make sure to read the Contributing Guide before making a pull request.

Welcome to submit a issue

If you encounter difficulties when using alova, whether it is a bug, or an unmet feature, you can submit an issue.

LICENSE

MIT

alova's People

Contributors

dependabot[bot] avatar jou-amjs avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.