feat(plugin): add onThrottle to throttle plugin for logging purpose

CHANGELOG.md

@@ -1,5 +1,9 @@
 # CHANGELOG 📝
 
+## v0.3.6 2024/04/6
+
+- feat(plugin): add `onThrottle` to throttle plugin for logging purpose
+
 ## v0.3.5 2024/03/30
 
 - feat(plugin): add `onDedupe` to dedupe plugin for logging purpose

Mock-plugin.md

@@ -61,8 +61,8 @@ instance.get('/api/hello').then((res) => {
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/mock.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -79,8 +79,8 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
-<script src="https://unpkg.com/[email protected].5/plugins/mock.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>

README.md

@@ -117,7 +117,7 @@ yarn add xior
 Use jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -132,7 +132,7 @@ Use jsDelivr CDN:
 Use unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -498,9 +498,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/error-retry.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/error-retry.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -513,10 +513,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/[email protected].5/plugins/error-retry.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/error-retry.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -541,6 +541,7 @@ function throttleRequestPlugin(options: {
    */
   enableThrottle?: boolean | ((config?: XiorRequestConfig) => boolean);
   throttleCache?: ICacheLike<RecordedCache>;
+  onThrottle?: (config: XiorRequestConfig) => void;
 }): XiorPlugin;
 ```
 
@@ -561,7 +562,13 @@ import xior from 'xior';
 import throttlePlugin from 'xior/plugins/throttle';
 
 const http = xior.create();
-http.plugins.use(throttlePlugin());
+http.plugins.use(
+  throttlePlugin({
+    onThrottle(config) {
+      console.log(`Throttle requests ${config.method} ${config.url}`);
+    },
+  })
+);
 
 http.get('/'); // make real http request
 http.get('/'); // response from cache
@@ -599,9 +606,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/throttle.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/throttle.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -614,10 +621,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/[email protected].5/plugins/throttle.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/throttle.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -672,9 +679,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/dedupe.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/dedupe.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -687,10 +694,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/[email protected].5/plugins/dedupe.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/dedupe.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -748,9 +755,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/error-cache.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/error-cache.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -763,10 +770,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/[email protected].5/plugins/error-cache.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/error-cache.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -901,9 +908,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/progress.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/progress.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -916,10 +923,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/[email protected].5/plugins/progress.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/progress.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -1026,9 +1033,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/[email protected].5/plugins/mock.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected].6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -1041,10 +1048,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/[email protected].5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/[email protected].5/plugins/mock.umd.js"></script>
+<script src="https://unpkg.com/[email protected].6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "xior",
-  "version": "0.3.5",
+  "version": "0.3.6",
   "description": "A lite request lib based on fetch with plugins support, and axios similar API",
   "repository": "suhaotian/xior",
   "bugs": "https://github.com/suhaotian/xior/issues",

src/plugins/throttle.ts

@@ -20,6 +20,7 @@ export type XiorThrottleOptions = {
    */
   enableThrottle?: boolean | ((config?: XiorRequestConfig) => boolean);
   throttleCache?: ICacheLike<RecordedCache>;
+  onThrottle?: (config: XiorRequestConfig) => void;
 };
 
 /** @ts-ignore */
@@ -34,6 +35,7 @@ export default function xiorThrottlePlugin(options: XiorThrottleOptions = {}): X
     enableThrottle: _enableThrottle,
     threshold: _threshold = 1000,
     throttleCache = lru<RecordedCache>(10),
+    onThrottle: _onThrottle,
   } = options;
 
   const cache = throttleCache;
@@ -72,6 +74,7 @@ export default function xiorThrottlePlugin(options: XiorThrottleOptions = {}): X
         paramsSerializer,
         threshold = _threshold,
         enableThrottle = _enableThrottle,
+        onThrottle = _onThrottle,
       } = config as XiorThrottleOptions & XiorRequestConfig;
 
       const isGet = config.method === 'GET' || config.isGet;
@@ -95,12 +98,10 @@ export default function xiorThrottlePlugin(options: XiorThrottleOptions = {}): X
 
         const now = Date.now();
         const cachedRecord = cache.get(index) || { timestamp: now };
-
-        if (now - cachedRecord.timestamp <= threshold) {
-          const responsePromise = cachedRecord.value;
-          if (responsePromise) {
-            return responsePromise;
-          }
+        const responsePromise = cachedRecord.value;
+        if (responsePromise && now - cachedRecord.timestamp <= threshold) {
+          onThrottle?.(config);
+          return responsePromise;
         }
 
         return recordCacheWithRequest(index, config);

src/xior.ts

@@ -26,7 +26,7 @@ export class xior {
   static create(options?: XiorRequestConfig): XiorInstance {
     return new xior(options);
   }
-  static VERSION = '0.3.5';
+  static VERSION = '0.3.6';
 
   config?: XiorRequestConfig;
   defaults: XiorInterceptorRequestConfig;

tests/src/tests/plugins/throttle.test.ts

@@ -23,6 +23,9 @@ describe('xior throttle plugin tests', () => {
   instance.plugins.use(
     xiorThrottlePlugin({
       threshold: 1000,
+      onThrottle(config) {
+        console.log(`Throttle requests ${config.method} ${config.url}`);
+      },
     })
   );