Loki

Loki is a free visual-regression tool for teams building Storybook projects, including React Native apps. Its reference-image workflow suits teams that want visual checks in CI and can manage their own browser and simulator setup; look elsewhere if you need cross-browser coverage or a service that starts test infrastructure for you.

Overview

Loki captures Storybook stories and compares them with approved screenshots, producing visual differences for review. Teams can approve updated references as interfaces change, while CI can fail tests when references are missing. That makes baseline changes deliberate, but it also means someone must review and accept legitimate updates.

The trade-off is operational responsibility: Loki will not start Storybook, an iOS simulator, or an Android emulator. Those servers need to be running before tests begin. For teams with an established Storybook and CI workflow, this is a focused way to catch unintended visual changes; teams seeking a turnkey capture service may find the setup burden a poor fit.

Key features

Storybook screenshots and review

The workflow runs from creating reference screenshots through comparison and diff review to approving changed references. Recent Storybook versions need no extra integration for non-React Native projects; older versions may require a React configuration import. React Native projects can integrate by importing loki/configure-react-native in storybook/storybook.js. This makes Loki well suited to teams already organizing UI examples in Storybook, rather than teams looking for a general-purpose web-page comparator.

Capture and comparison choices

Capture targets include Chrome in Docker, local Chrome, the iOS simulator, and the Android emulator. Chrome on AWS Lambda offers remote rendering for large suites. The documented diff engines are pixelmatch, gm, and looks-same; gm requires GraphicsMagick, while Docker is optional if using the Docker Chrome target. The options give teams flexibility to match an existing environment, but Loki does not provide cross-browser capture.

Configuration and CI

Configuration can live in the loki section of package.json or in .lokirc, .lokirc.json, or loki.config.js. Loki is designed for continuous integration and can fail when reference images are missing, a useful safeguard against unreviewed baselines. Node 16 or later is required.

Animation limits

Known limitations cover looping requestAnimationFrame animations, GIFs, SVG animations, native Lottie animations, and React Native Animated. Projects that depend on these moving elements should account for the limits before relying on screenshot diffs as a complete visual check.

Pricing

Loki: free. The plan is MIT-licensed open-source software and requires Node 16 or later. There is no paid tier or trial; this is a free tool for teams prepared to operate it within their own setup, not a priced managed service.

Platforms

Loki supports Android and iOS capture through their emulators or simulator, Linux and macOS, Windows, web, and self-hosted environments. These are not interchangeable capture modes: the documented browser options are Chrome in Docker, local Chrome, and Chrome in AWS Lambda, alongside the mobile targets.

Who it's for

Loki is the strongest fit for Storybook teams that want a free, configurable visual-regression step in CI, especially when they need mobile simulator or emulator captures and can keep the required servers running. It is a weaker choice for teams needing cross-browser comparisons, animation coverage across the documented limitations, or infrastructure managed by the tool.

Pros and cons

• Pro: Reference screenshots, visual diffs, and approval of updated baselines give teams a defined review loop for interface changes.
• Pro: Chrome, iOS simulator, and Android emulator targets, plus AWS Lambda rendering for large suites, cover several useful environments without a subscription.
• Pro: MIT licensing and configurable setup make Loki adaptable for teams that can maintain their own workflow.
• Con: Storybook and simulator or emulator servers must already be running, adding setup work to local and CI workflows.
• Con: There is no cross-browser capture, and several animation types are documented limitations, narrowing its usefulness for motion-heavy interfaces or broad browser checks.

Alternatives

Visual Regression Testing Software is a broader category to explore when comparing tools beyond Storybook-oriented workflows.

• Diffy is worth considering if a monthly allowance of 500 screenshots, two environments, team management, and one-month data retention better matches the workflow.
• Happo may suit teams seeking 5,000 monthly snapshots, Chrome, and visual and accessibility testing on its free plan, with no credit card or time limit.
• Percy is an option for teams whose needs fit its free allowance of 5,000 screenshots per month, unlimited users, and unlimited projects.
• SmartUI may fit a project that can work within 2,000 lifetime screenshots, one month of build history, and limited user seats on its free plan.
• Frontend Regression Validator is another free, open-source option, licensed under Apache-2.0 and runnable locally or with Docker.
• Screenster has a free plan with one concurrent test, one user, and monthly local or cloud run limits.
• Argos is an alternative whose platform and SDKs are open source and MIT-licensed.
• BackstopJS is another free, MIT-licensed project installed with npm.

Verdict

Choose Loki if your team uses Storybook and wants a free reference-image workflow that can run in CI, with Chrome and mobile capture options. Its strongest reason to choose it is that focused, configurable review loop; its clearest reason to look elsewhere is the need to manage running servers yourself, alongside the absence of cross-browser capture.