Title: Better File Upload/Download operations in oRPC thanks to builtin integration of TUS · Issue #482 · middleapi/orpc · GitHub
Open Graph Title: Better File Upload/Download operations in oRPC thanks to builtin integration of TUS · Issue #482 · middleapi/orpc
X Title: Better File Upload/Download operations in oRPC thanks to builtin integration of TUS · Issue #482 · middleapi/orpc
Description: This is just an idea; I haven't thought about how it will work or what the API will look like yet. As told in the documentation: For files larger than 10MB, it is recommended to use a dedicated solution for performance and reliability. F...
Open Graph Description: This is just an idea; I haven't thought about how it will work or what the API will look like yet. As told in the documentation: For files larger than 10MB, it is recommended to use a dedicated sol...
X Description: This is just an idea; I haven't thought about how it will work or what the API will look like yet. As told in the documentation: For files larger than 10MB, it is recommended to use a dedicated...
Opengraph URL: https://github.com/middleapi/orpc/issues/482
X: @github
Domain: github.com
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Better File Upload/Download operations in oRPC thanks to builtin integration of TUS","articleBody":"This is just an idea; I haven't thought about how it will work or what the API will look like yet.\n\nAs told in the [documentation](https://orpc.unnoq.com/docs/file-upload-download):\n> For files larger than 10MB, it is recommended to use a dedicated solution for performance and reliability.\n\nFrom my understanding, it is not recommended for \"big\" files, because under the hood, it encodes/decodes in base64 (haven't tested it)?\nEven, file upload is much more than only 1 API request, it's not the same thing as basic JSON api call. Performance and resumable file uploads are crucial + good UX client side to show how much kb has been uploaded and much need to be uploaded still etc.\n\n[tus - Open Protocol for Resumable File Uploads](https://tus.io) makes file uploads more reliable and performant for any size of files.\n\nWhile, we can already use [@tus/server](https://www.npmjs.com/package/@tus/server) in combination with oRPC, I believe there might be a better way that keep type-safety, zod goodness and simplicity while preserving tus goodness too.\n\nWould be great to define oRPC route as \"tus route\" and then call them with the RPCClient like normal routes with more features like [tus-js-client](https://www.npmjs.com/package/tus-js-client), for example:\n\n```ts\nconst handleUpload = async (file: File): Promise\u003cvoid> => {\n const upload = new tus.Upload(file, {\n retryDelays: [0, 1_000, 3_000, 5_000],\n metadata: {\n filename: file.name,\n mimetype: file.type\n },\n onError: (error) => {\n console.error(error)\n },\n onProgress: (bytesUploaded, bytesTotal) =>{\n const percentage = (bytesUploaded / bytesTotal * 100).toFixed(2)\n console.log(bytesUploaded, bytesTotal, percentage + \"%\")\n },\n onSuccess: () => {\n console.log(\"Download %s from %s\", upload.file.name, upload.url)\n }\n })\n const [previousUpload] = await upload.findPreviousUploads()\n if (previousUpload != null) {\n upload.resumeFromPreviousUpload(previousUpload)\n }\n upload.start()\n}\n```\n\nThe good thing, is that we can have a `onProgress` and regularly tell the user, how much bytes uploaded, how much still needed, percentage.\n\nAlso we have out of the box, resumability so for example, if the internet connection of the user is bad, and is interrupted, they can try to upload again the file, without the need of uploading the file from scratch, especially useful for big files, or really bad connection, like mobile network.\n\nWe could have a way to do it, with oRPC, the same type-safety, and APIs to define middleware.","author":{"url":"https://github.com/theoludwig","@type":"Person","name":"theoludwig"},"datePublished":"2025-05-09T14:20:01Z","url":"https://github.com/middleapi/orpc/issues/482"}
| react-profiling | 0 |
| react-import-map | react,react-dom,react-dom/client,react-dom/profiling,react-is,react-reconciler,react/compiler-runtime,react/jsx-dev-runtime,react/jsx-runtime,scheduler@d5750093facf |
| route-pattern | /_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format) |
| route-controller | voltron_issues_fragments |
| route-action | issue_layout |
| fetch-nonce | v2:0b2b110e-ce91-b3fb-debf-1b68f61c6101 |
| current-catalog-service-hash | 81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114 |
| request-id | 8478:35FB3F:3DC673:56C60E:6AF9B237 |
| html-safe-nonce | ebac9b7b021fbb446b735deddbcab88042f1f676c2f631a2fcf84ae0807fea23 |
| visitor-payload | eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiI4NDc4OjM1RkIzRjozREM2NzM6NTZDNjBFOjZBRjlCMjM3IiwidmlzaXRvcl9pZCI6IjU1NjUxNDcwMzU5ODk1NTM3MTkiLCJyZWdpb25fZWRnZSI6ImlhZCIsInJlZ2lvbl9yZW5kZXIiOiJpYWQifQ== |
| visitor-hmac | 204ce7eb8f2b2190b8a68fcc52516875a7f8d615e42597c1d511428a3541df82 |
| hovercard-subject-tag | issue:3052326382 |
| github-keyboard-shortcuts | repository,issues,copilot |
| google-site-verification | Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I |
| octolytics-url | https://collector.github.com/github/collect |
| analytics-location | / |
| fb:app_id | 1401488693436528 |
| apple-itunes-app | app-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/middleapi/orpc/482/issue_layout |
| twitter:image | https://opengraph.githubassets.com/e1cab3ad2a13c1ab86c4f916dd2f3f2a61eb3ec0a1deebdf68698f4856e372f9/middleapi/orpc/issues/482 |
| twitter:card | summary_large_image |
| og:image | https://opengraph.githubassets.com/e1cab3ad2a13c1ab86c4f916dd2f3f2a61eb3ec0a1deebdf68698f4856e372f9/middleapi/orpc/issues/482 |
| og:image:alt | This is just an idea; I haven't thought about how it will work or what the API will look like yet. As told in the documentation: For files larger than 10MB, it is recommended to use a dedicated sol... |
| og:image:width | 1200 |
| og:image:height | 600 |
| og:site_name | GitHub |
| og:type | object |
| og:author:username | theoludwig |
| hostname | github.com |
| expected-hostname | github.com |
| None | 612d3e6ffd693e7ea8d9fcf452370995872baef31d825b1fedef704cd3d24ac7 |
| turbo-cache-control | no-preview |
| go-import | github.com/middleapi/orpc git https://github.com/middleapi/orpc.git |
| octolytics-dimension-user_id | 173978236 |
| octolytics-dimension-user_login | middleapi |
| octolytics-dimension-repository_id | 863811008 |
| octolytics-dimension-repository_nwo | middleapi/orpc |
| octolytics-dimension-repository_public | true |
| octolytics-dimension-repository_is_fork | false |
| octolytics-dimension-repository_network_root_id | 863811008 |
| octolytics-dimension-repository_network_root_nwo | middleapi/orpc |
| turbo-body-classes | logged-out env-production page-responsive |
| disable-turbo | false |
| browser-stats-url | https://api.github.com/_private/browser/stats |
| browser-errors-url | https://api.github.com/_private/browser/errors |
| release | 072e34035c13c31543fba9f025cbbbda4210dae4 |
| ui-target | full |
| theme-color | #1e2327 |
| color-scheme | light dark |
| react-app-name | issues |
Links:
Viewport: width=device-width