Huang Xin 75f1fafe9f feat(reader): slide and page curl turn animations (#555) (#4940)
* feat(reader): slide and page curl turn animations (#555)

Add an Animation Style setting (Push, Slide, Page Curl) next to the
Paging Animation switch. Slide moves the turning page over the still
previous or next page like the Apple Books slide; Page Curl folds it
open in 3D so the page underneath is partially visible as it turns.
Both styles track the finger: the page follows a horizontal drag and
commits past halfway or on a flick, or settles back. The page header
and footer stay in place while the page turns.

The styles layer a View Transitions snapshot of the outgoing page over
the live, stationary incoming page, since the pages of one section live
in a single iframe and can never be on screen twice. They work for all
writing modes including vertical-rl, and on engines without the View
Transitions API (older WebViews) the paginator falls back to the
existing push animation, so all platforms keep working page turns.

The paginator changes live in the foliate-js submodule; this bumps the
pointer, wires viewSettings.pageTurnStyle to the renderer turn-style
attribute, and adds browser tests covering slide layering, curl,
vertical-rl, finger tracking with commit and revert, and the push
fallback.

Fixes #555

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* feat(reader): add WebGL page curl renderer for mesh turn animations (#555)

Grid mesh deformed around a cylinder: content past the fold wraps over
and lands mirrored on top with a whitened page back, transparent where
the page has curled away. Corner grabs start as a steep diagonal pinch
that straightens as the turn completes so the whole page clears by the
end. Groundwork for the Tauri mesh curl; capture and orchestration land
separately.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* feat(native-bridge): capture webview region as PNG on macOS and iOS (#555)

New capture_webview_region plugin command returns a binary PNG snapshot
of the calling webview (tauri::ipc::Response, no JSON overhead) for the
mesh page-curl texture. macOS goes through WKWebView
takeSnapshotWithConfiguration via with_webview on the main thread with
a 500ms timeout; iOS snapshots in Swift and hands the PNG across the
JSON-only plugin boundary base64-encoded, decoded back to bytes in
mobile.rs. Windows, Linux, and Android reject for now so the JS side
falls back to the CSS curl.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* feat(reader): drive the mesh page curl on Tauri platforms (#555)

Wire the WebGL curl renderer and the native webview capture into page
turns. A MeshCurlTurn controller runs the pipeline per turn: snapshot
the content box, overlay the captured page drawn flat, turn the live
view instantly underneath (the paginator's animated paths all gate on
the animated attribute), then curl the capture away. Backward turns
mirror the fold to the spine edge, matching the layered VT curl's
old-page-recedes choreography.

useMeshPageCurl wraps the view's prev/next so taps, keys, and wheel
turns all curl, and registers a touch interceptor (between the reading
ruler and the fixed-layout swipe) that scrubs the curl from the finger,
committing past halfway or on a flick and otherwise un-curling and
turning back under the overlay. The paginator stays out of the way via
no-swipe while the mesh is active; if the native capture ever fails the
session falls back to the paginator's CSS arc-fold curl and the shared
applyPageTurnAttributes helper restores turn-style.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* fix(build): restore iOS builds on Xcode 26.2 with a vendored swift-rs

Swift 6.2's driver no longer honors swift-rs 1.0.7's cross-compilation
style (swift build --arch <host> with per-swiftc -target overrides and
an inherited SDKROOT): plugin sources compile against the wrong
platform's Swift overlays and fail with baffling errors like type
'Bundle' has no member 'main' and extra argument 'privacy' in call.
Upstream swift-rs is unmaintained, so vendor it under packages/swift-rs
via a crates-io patch and build with SPM's first-class --triple/--sdk
flags instead, dropping the leaked SDKROOT so the host-targeted
manifest compile stays clean. Artifacts land in the unversioned-triple
directory now, so the link search path follows.

With --triple, SPM enforces the deployment floor declared in
Package.swift (the old override bypassed it): bump native-bridge to
iOS 15.0, matching the app's deployment target, since StoreKit's
Storefront is used unguarded.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* feat(native-bridge): capture webview region on Android via PixelCopy (#555)

Implements the Android side of capture_webview_region so the mesh page
curl works there too. The Kotlin command scales the CSS-pixel rect by
the display density, offsets it by the webview's window position, and
reads the pixels back from the window surface with PixelCopy (API 26+,
the app's minSdk), which includes the hardware-accelerated WebView that
View.draw would miss. PNG encoding runs off the main thread and the
result crosses the JSON plugin boundary base64-encoded, decoded back to
bytes in mobile.rs like iOS.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* fix(reader): right the upside-down page curl on iOS (#555)

The renderer oriented its texture with UNPACK_FLIP_Y_WEBGL, which WebKit
ignores for ImageBitmap uploads: on iOS the captured page rendered
upside down, and the mirrored page back read as rotated 180 degrees
instead of the ink-through-paper horizontal mirror Apple Books shows.
Upload unflipped and sample page coordinates directly so no pixel-store
flag is involved.

The page texture in the browser test was only horizontally asymmetric,
which is how the flip slipped through; it now uses four quadrants fed
through the production PNG-blob-to-ImageBitmap path and pins the
vertical orientation. Verified red/green by running the suite on
Playwright WebKit, which reproduces the iOS behavior.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* fix(reader): curl the whole page including header, footer, and margins (#555)

The mesh curl captured only the margin-inset content box, leaving the
running header, footer, and page margins static while just the text
column turned. A physical page turn takes the whole sheet with it, as
Apple Books does, so the capture and overlay now span the full reader
cell. The overlay mounts above the in-cell header (z-10) and footer, so
the static copies never show through the turning page.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* fix(reader): gate layered View Transition turns and slide from a capture instead (#555)

iOS 18 WebKit ships document.startViewTransition but crashes the WebContent
process when a page-turn transition snapshots the reader, so the mere
presence of the API is not enough for the layered slide/curl turns. Require
nested view-transition groups (Chrome/WebView 140+) as the marker of a
mature engine before setting turn-style on the renderer.

Engines that fail the check no longer lose the slide on Tauri: the mesh
curl's capture pipeline generalizes to CapturedPageTurn and now also drives
a flat slide overlay (capture the outgoing page, turn instantly underneath,
translate the captured page out toward the spine, mirrored for backward
turns), clipped to the content box with an edge shadow like the VT slide.
On the web, engines without full support fall back to push and the
Slide/Page Curl options are hidden from the Animation Style select; a
synced slide/curl setting from another device reads as Push there.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* fix(reader): make the Android page curl start instantly (#555)

The Android capture encoded a full-density PNG: 1080x2400 on a 3x
Xiaomi 13 took ~1.5s per turn, so the page sat frozen long enough to
read as the curl not working at all. Encode JPEG instead (the page is
opaque) and cap the destination bitmap at 2x CSS pixels - PixelCopy
scales into a smaller bitmap for free and the moving page stays sharp.
Measured on device over CDP: the capture invoke drops from 1550ms to
34ms and the curl overlay mounts 132ms after the tap.

The JS side stops hardcoding an image/png blob type and lets the
decoder sniff the platform's actual format.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* perf(reader): encode iOS page-curl captures as capped JPEG (#555)

Apply the Android speedup to iOS: encode the snapshot as JPEG (the
page is opaque) off the main thread, and cap it at 2x CSS pixels via
WKSnapshotConfiguration.snapshotWidth on 3x screens, cutting both the
encode time and the base64 payload crossing the JSON plugin boundary.
The JS side already sniffs the image format from the bytes.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

---------

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
2026-07-05 20:49:57 +02:00
2025-01-21 07:18:00 +01:00
2024-11-11 21:25:22 +01:00

Readest Logo

Readest


Readest is an open-source ebook reader designed for immersive and deep reading experiences. Built as a modern rewrite of Foliate, it leverages Next.js 16 and Tauri v2 to deliver a smooth, cross-platform experience across macOS, Windows, Linux, Android, iOS, and the Web.

Website Web App OS
Discord Reddit AGPL Licence Language Coverage Donate Latest release Last commit Commits Ask DeepWiki

FeaturesPlanned FeaturesScreenshotsDownloadsDocumentationGetting StartedTroubleshootingSupportLicense

Features

Implemented
Feature Description Status
Multi-Format Support Support EPUB, MOBI, KF8 (AZW3), FB2, CBZ, TXT, PDF
Scroll/Page View Modes Switch between scrolling or paginated reading modes.
Full-Text Search Search across the entire book to find relevant sections.
Annotations and Highlighting Add highlights, bookmarks, and notes to enhance your reading experience and use instant mode for quicker interactions.
Dictionary/Wikipedia Lookup Instantly look up words and terms when reading.
Parallel Read Read two books or documents simultaneously in a split-screen view.
Customize Font and Layout Adjust font, layout, theme mode, and theme colors for a personalized experience.
Code Syntax Highlighting Read software manuals with rich coloring of code examples.
File Association and Open With Quickly open files in Readest in your file browser with one-click.
Library Management Organize, sort, and manage your entire ebook library.
OPDS/Calibre Integration Integrate OPDS/Calibre to access online libraries and catalogs.
Translate with DeepL and Yandex From a single sentence to the entire book—translate instantly.
Text-to-Speech (TTS) Support Enjoy smooth, multilingual narration—even within a single book.
Sync across Platforms Synchronize book files, reading progress, notes, and bookmarks across all supported platforms.
Sync with Koreader Synchronize reading progress, notes, and bookmarks with Koreader devices.
Accessibility Provides full keyboard navigation and supports for screen readers such as VoiceOver, TalkBack, NVDA, and Orca.
Visual & Focus Aids Reading ruler, paragraph-by-paragraph reading mode, and speed reading features.

Planned Features

🛠 Building
🔄 Planned
Feature Description Priority
AI-Powered Summarization Generate summaries of books or chapters using AI for quick insights. 🛠
Advanced Reading Stats Track reading time, pages read, and more for detailed insights. 🛠
Audiobook Support Extend functionality to play and manage audiobooks. 🔄
Handwriting Annotations Add support for handwriting annotations using a pen on compatible devices. 🔄
In-Library Full-Text Search Search across your entire ebook library to find topics and quotes. 🔄

Stay tuned for continuous improvements and updates! Contributions and suggestions are always welcome—let's build the ultimate reading experience together. 😊

Screenshots

Annotations

TTS

DeepL

Footnote

Wikipedia

Theming Dark Mode


Downloads

Mobile Apps

Download on the App Store     Get it on Google Play

Platform-Specific Downloads

Documentation

Guides, tutorials, and FAQs for installing and using Readest live in the official documentation:

📖 https://readest.com/docs

Requirements

  • Node.js and pnpm for Next.js development
  • Rust and Cargo for Tauri development

For the best experience to build Readest for yourself, use a recent version of Node.js and Rust. Refer to the Tauri documentation for details on setting up the development environment prerequisites on different platforms.

nvm install v24
nvm use v24
npm install -g pnpm
rustup update

Getting Started

To get started with Readest, follow these steps to clone and build the project.

1. Clone the Repository

git clone https://github.com/readest/readest.git
cd readest

2. Install Dependencies

# might need to rerun this when code is updated
git submodule update --init --recursive
pnpm install
# copy vendors dist libs to public directory
pnpm --filter @readest/readest-app setup-vendors

3. Verify Dependencies Installation

To confirm that all dependencies are correctly installed, run the following command:

pnpm tauri info

This command will display information about the installed Tauri dependencies and configuration on your platform. Note that the output may vary depending on the operating system and environment setup. Please review the output specific to your platform for any potential issues.

For Windows targets, “Build Tools for Visual Studio 2022” (or a higher edition of Visual Studio) and the “Desktop development with C++” workflow must be installed. For Windows ARM64 targets, the “VS 2022 C++ ARM64 build tools” and "C++ Clang Compiler for Windows" components must be installed. And make sure clang can be found in the path by adding C:\Program Files (x86)\Microsoft Visual Studio\2022\BuildTools\VC\Tools\Llvm\x64\bin for example in the environment variable Path.

4. Build for Development

# Start development for the Tauri app
pnpm tauri dev
# or start development for the Web app
pnpm dev-web
# preview with OpenNext build for the Web app
pnpm preview

For Android:

# Initialize the Android environment (run once)
rm apps/readest-app/src-tauri/gen/android
pnpm tauri android init
pnpm tauri icon ../../data/icons/readest-book.png
git checkout apps/readest-app/src-tauri/gen/android

pnpm tauri android dev
# or if you want to dev on a real device
pnpm tauri android dev --host

For iOS:

# Set up the iOS environment (run once)
pnpm tauri ios init
pnpm tauri icon ../../data/icons/readest-book.png

pnpm tauri ios dev
# or if you want to dev on a real device
pnpm tauri ios dev --host

5. Build for Production

pnpm tauri build
pnpm tauri android build
pnpm tauri ios build

Please refer to our release script if you experience any issues: https://github.com/readest/readest/blob/main/.github/workflows/release.yml

6. Setup dev environment with Nix

If you have Nix installed, you can leverage flake to enter a development shell with all the necessary dependencies:

nix develop ./ops  # enter a dev shell for the web app
nix develop ./ops#ios # enter a dev shell for the ios app
nix develop ./ops#android # enter a dev shell for the android app

7. More information

Please check the wiki of this project for more information on development.

Troubleshooting

1. Readest Wont Launch on Windows (Missing Edge WebView2 Runtime)

Symptom

  • When you double-click readest.exe, nothing happens. No window appears, and Task Manager does not show the process.
  • This can affect both the standard installer and the portable version.

Cause

  • Microsoft Edge WebView2 Runtime is either missing, outdated, or improperly installed on your system. Readest depends on WebView2 to render the interface on Windows.

How to Fix

  1. Check if WebView2 is installed
    • Open “Add or Remove Programs” (a.k.a. Apps & features) on Windows. Look for “Microsoft Edge WebView2 Runtime.”
  2. Install or Update WebView2
    • Download the WebView2 Runtime directly from Microsoft: link.
    • If you prefer an offline installer, download the offline package and run it as an Administrator.
  3. Re-run Readest
    • After installing/updating WebView2, launch readest.exe again.
    • If you still encounter problems, reboot your PC and try again.

Additional Tips

  • If reinstalling once doesnt work, uninstall Edge WebView2 completely, then reinstall it with Administrator privileges.
  • Verify your Windows installation has the latest updates from Microsoft.

Still Stuck?

  • See Issue readest/readest#358 for further details, or head over to our Discord server and open a support discussion with detailed logs of your environment and the steps youve taken.

2. AppImage Launches but Only Shows a Taskbar Icon

On some Arch Linux systems—especially those using Wayland—the Readest AppImage may briefly show an icon in the taskbar and then exit without opening a window.

You might see logs such as:

Could not create default EGL display: EGL_BAD_PARAMETER. Aborting...

This behavior is usually caused by compatibility issues between the bundled AppImage libraries and the systems EGL / Wayland environment.

Workaround 1: Launch with LD_PRELOAD (recommended)

You can preload the system Wayland client library before launching the AppImage:

LD_PRELOAD=/usr/lib/libwayland-client.so /path/to/Readest.AppImage

This workaround has been confirmed to resolve the issue on affected systems.

Workaround 2: Use the Flatpak Version

If you prefer a more reliable out-of-the-box experience on Arch Linux, consider using the Flatpak build on Flathub instead. The Flatpak runtime helps avoid system library mismatches and tends to behave more consistently across different Wayland and X11 setups.

Contributors

Readest is open-source, and contributions are welcome! Feel free to open issues, suggest features, or submit pull requests. Please review our contributing guidelines before you start. We also welcome you to join our Discord community for either support or contributing guidance.

A table of avatars from the project's contributors

Support

If Readest has been useful to you, consider supporting its development at donate.readest.com, where you'll find all available donation methods, including GitHub Sponsors, card payments, and crypto. Your contribution helps us fix bugs faster, improve performance, and keep building great features.

License

Readest is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. See the LICENSE file for details.

The following libraries and frameworks are used in this software:

  • foliate-js, which is MIT licensed.
  • zip.js, which is licensed under the BSD-3-Clause license.
  • fflate, which is MIT licensed.
  • PDF.js, which is licensed under Apache License 2.0.
  • daisyUI, which is MIT licensed.
  • marked, which is MIT licensed.
  • next.js, which is MIT licensed.
  • react-icons, which has various open-source licenses.
  • react, which is MIT licensed.
  • tauri, which is MIT licensed.

The following fonts are utilized in this software, either bundled within the application or provided through web fonts:

Bitter, Fira Code, Inter, Literata, Merriweather, Noto Sans, Roboto, LXGW WenKai, MiSans, Source Han, WenQuanYi Micro Hei

We would also like to thank the Web Chinese Fonts Plan for offering open-source tools that enable the use of Chinese fonts on the web.


Happy reading with Readest!
S
Description
Local mirror of readest/readest for EPUB review editor migration
Readme 160 MiB
Languages
TypeScript 78.3%
MDX 10.1%
Lua 3.8%
Rust 3.2%
Kotlin 1.3%
Other 3.1%