diff --git a/packages/hooks/src/useRafInterval/__tests__/index.spec.ts b/packages/hooks/src/useRafInterval/__tests__/index.spec.ts
index aea64964fa..374537f525 100644
--- a/packages/hooks/src/useRafInterval/__tests__/index.spec.ts
+++ b/packages/hooks/src/useRafInterval/__tests__/index.spec.ts
@@ -58,4 +58,16 @@ describe('useRafInterval', () => {
     // not to be called
     expect(callback).toHaveBeenCalledTimes(0);
   });
+
+  test('execute clear in the callback and interval should be clear', () => {
+    const callback = vi.fn().mockImplementation(() => hook.result.current());
+    const hook = setUp({ fn: callback, delay: FRAME_TIME });
+
+    expect(callback).not.toBeCalled();
+
+    vi.advanceTimersByTime(FRAME_TIME * 1.5);
+    expect(callback).toHaveBeenCalledTimes(1);
+    vi.advanceTimersByTime(FRAME_TIME * 1.5);
+    expect(callback).toHaveBeenCalledTimes(1);
+  });
 });
diff --git a/packages/hooks/src/useRafInterval/index.ts b/packages/hooks/src/useRafInterval/index.ts
index 56cb33fef6..0b27e6fa5a 100644
--- a/packages/hooks/src/useRafInterval/index.ts
+++ b/packages/hooks/src/useRafInterval/index.ts
@@ -18,11 +18,11 @@ const setRafInterval = (callback: () => void, delay: number = 0): Handle => {
   };
   const loop = () => {
     const current = Date.now();
+    handle.id = requestAnimationFrame(loop);
     if (current - start >= delay) {
       callback();
       start = Date.now();
     }
-    handle.id = requestAnimationFrame(loop);
   };
   handle.id = requestAnimationFrame(loop);
   return handle;