immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2026-02-05 00:30:57 +03:00
Code Issues 25 Packages Projects Releases 10 Wiki Activity

PERF: switch from axios to fetch #2064

New Issue
Closed
opened 2026-02-05 04:55:21 +03:00 by OVERLORD · 4 comments
OVERLORD commented 2026-02-05 04:55:21 +03:00
Owner
Copy Link

Originally created by @benmccann on GitHub (Jan 26, 2024).

The bug

The typescript-axios generator pulls in an extra dependency on axios. The typescript-fetch generator could avoid this by using the browser's built-in fetch method.

Note that fetch is not supported in Internet Explorer (https://caniuse.com/fetch). I didn't see in the docs which browsers are supported, but I'm guessing IE is not a concern since it's a fairly recent app

The OS that Immich Server is running on

any

Version of Immich Server

any

Version of Immich Mobile App

any

Platform with the issue

  • Server
  • Web
  • Mobile

Your docker-compose.yml content

n/a

Your .env content

n/a

Reproduction steps

https://github.com/immich-app/immich/blob/main/open-api/bin/generate-open-api.sh
https://github.com/immich-app/immich/blob/ca28e1e7a82b4467012e27934c2cddda39ea2c6c/.github/workflows/dispatch_sdk_update.yml#L23

Additional information

No response

Originally created by @benmccann on GitHub (Jan 26, 2024). ### The bug The typescript-axios generator pulls in an extra dependency on `axios`. The typescript-fetch generator could avoid this by using the browser's built-in `fetch` method. Note that `fetch` is not supported in Internet Explorer (https://caniuse.com/fetch). I didn't see in the docs which browsers are supported, but I'm guessing IE is not a concern since it's a fairly recent app ### The OS that Immich Server is running on any ### Version of Immich Server any ### Version of Immich Mobile App any ### Platform with the issue - [X] Server - [X] Web - [X] Mobile ### Your docker-compose.yml content ```YAML n/a ``` ### Your .env content ```Shell n/a ``` ### Reproduction steps ```bash https://github.com/immich-app/immich/blob/main/open-api/bin/generate-open-api.sh https://github.com/immich-app/immich/blob/ca28e1e7a82b4467012e27934c2cddda39ea2c6c/.github/workflows/dispatch_sdk_update.yml#L23 ``` ### Additional information _No response_
OVERLORD commented 2026-02-05 04:55:26 +03:00
Author
Owner
Copy Link

@jrasm91 commented on GitHub (Jan 26, 2024):

I'd be fine with this, just implies testing and validating the new client. Specifically, the file/attachment upload endpoints have always been tricky with the auto-generated clients.

@jrasm91 commented on GitHub (Jan 26, 2024): I'd be fine with this, just implies testing and validating the new client. Specifically, the file/attachment upload endpoints have always been tricky with the auto-generated clients.
OVERLORD commented 2026-02-05 04:55:29 +03:00
Author
Owner
Copy Link

@benmccann commented on GitHub (Feb 1, 2024):

I took a look at this and overall it's quite nice as it removes the need to do .data on every response.

The trickiest thing is figuring out how to re-implement onUploadProgress and onDownloadProgress from axios. Firefox/Safari don't have full support for the necessary fetch APIs (one only supports upload and the other only supports download):

So the only way to monitor progress of these large file transfers appears to be to drop down and use XHR directly for that API call rather than using the typescript-fetch API for that specific call.

@benmccann commented on GitHub (Feb 1, 2024): I took a look at this and overall it's quite nice as it removes the need to do `.data` on every response. The trickiest thing is figuring out how to re-implement `onUploadProgress` and `onDownloadProgress` from axios. Firefox/Safari don't have full support for the necessary `fetch` APIs (one only supports upload and the other only supports download): - https://github.com/axios/axios/issues/1219#issuecomment-1281827059 - https://developer.mozilla.org/en-US/docs/Web/API/Request/body - https://developer.mozilla.org/en-US/docs/Web/API/Response/body So the only way to monitor progress of these large file transfers appears to be to drop down and use XHR directly for that API call rather than using the `typescript-fetch` API for that specific call.
OVERLORD commented 2026-02-05 04:55:32 +03:00
Author
Owner
Copy Link

@jrasm91 commented on GitHub (Feb 2, 2024):

That might be a reasonable compromise. So far we have had to manually re-implement those endpoints to some extent anyways. Another option (maybe in the short term). Is to only use axios for those two requests and eventually substitute them out later.

@jrasm91 commented on GitHub (Feb 2, 2024): That might be a reasonable compromise. So far we have had to manually re-implement those endpoints to some extent anyways. Another option (maybe in the short term). Is to only use axios for those two requests and eventually substitute them out later.
OVERLORD commented 2026-02-05 04:55:37 +03:00
Author
Owner
Copy Link

@benmccann commented on GitHub (Feb 11, 2024):

I migrated the CLI from the typescript-axios to typescript-fetch, but which removed the axios dependency. However, I saw that unused API methods weren't being tree shaken out, so switched to oazapfts, which does support tree shaking and produces output that's only 1/10 the size of typescript-fetch even before tree shaking.

I filed https://github.com/oazapfts/oazapfts/issues/571 as a feature request to ease the transition for APIs that use enums. We could still migrate without that, but it would require some more code changes. I also sent https://github.com/oazapfts/oazapfts/pull/568 to reduce code size a bit, but that's not a blocker at all.

For the most part, the migration should be pretty straightforward. We just need to replace @api with @immich/sdk and update calls like api.getPeopleThumbnailUrl to use getPeopleThumbnailUrl included via import { getPeopleThumbnailUrl } from '@immich/sdk'. The one thing that will be harder is progress tracking: https://github.com/immich-app/immich/issues/6647#issuecomment-1921738727

@benmccann commented on GitHub (Feb 11, 2024): I migrated the CLI from the `typescript-axios` to `typescript-fetch`, but which removed the axios dependency. However, I saw that unused API methods weren't being tree shaken out, so switched to `oazapfts`, which does support tree shaking and produces output that's only 1/10 the size of `typescript-fetch` even before tree shaking. I filed https://github.com/oazapfts/oazapfts/issues/571 as a feature request to ease the transition for APIs that use enums. We could still migrate without that, but it would require some more code changes. I also sent https://github.com/oazapfts/oazapfts/pull/568 to reduce code size a bit, but that's not a blocker at all. For the most part, the migration should be pretty straightforward. We just need to replace `@api` with `@immich/sdk` and update calls like `api.getPeopleThumbnailUrl` to use `getPeopleThumbnailUrl` included via `import { getPeopleThumbnailUrl } from '@immich/sdk'`. The one thing that will be harder is progress tracking: https://github.com/immich-app/immich/issues/6647#issuecomment-1921738727
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
accessibility
changelog:enhancement
changelog:security
changelog:skip
changelog:translation
cli
date-time
documentation
external-library
format
good first issue
needs-answer
nice to have
sharing
tech-debt
📱mobile
🖥️web
🗄️server
🧠machine-learning
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
OVERLORD
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: immich-app/immich#2064
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?