Skip to content

Conversation

@Olovyannikov
Copy link

@Olovyannikov Olovyannikov commented Dec 14, 2025

Closes #116

Why is this important?

Performance

Each useUnit call creates its own subscription management overhead. Combining them reduces:

  • Number of hook calls
  • Subscription management overhead
  • Re-render coordination complexity

Code clarity

A single useUnit call makes it easier to:

  • See all dependencies at a glance
  • Understand component's reactive logic
  • Maintain and refactor code

Example

// correct
const Component = () => {
  const [value, setValue] = useUnit([$store, storeUpdated]);
}

// incorrect
const Component = () => {
  const [value] = useUnit([$store]);
  const [setValue] = useUnit([storeUpdated]);
}

Separate stores and events calls

If you want to separate stores and events as independent groups, you can use option allowSeparateStoresAndEvents

When set to true, allows separate useUnit calls for stores and events, but still enforces combining multiple calls within each group.

Example

// correct
const Component = () => {
  const [value, setValue] = useUnit([$store, storeUpdated]);
}

// if `enforceStoresAndEventsSeparation` flag is on:
const Component = () => {
  const [value, setValue] = useUnit([$store, storeUpdated]);
  
   // will be transformed to:
   
  const [value] = useUnit([$store]);
  const [setValue] = useUnit([storeUpdated])
}

// also correct
const Component = () => {
  const [value] = useUnit([$store]);
  const [setValue] = useUnit([storeUpdated]);
}

// incorrect
const Component = () => {
  const [value] = useUnit([$store]);
  const [setValue] = useUnit([storeUpdated]);
  const [setAnotherValue] = useUnit([thirdEvent]);
}

@netlify
Copy link

netlify bot commented Dec 14, 2025

Deploy Preview for eslint-plugin ready!

Name Link
🔨 Latest commit d009b75
🔍 Latest deploy log https://app.netlify.com/projects/eslint-plugin/deploys/693ea68e9122d20008c2d83e
😎 Deploy Preview https://deploy-preview-176--eslint-plugin.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@Olovyannikov Olovyannikov force-pushed the new/prefer-single-binding branch 3 times, most recently from 4eb50a2 to 7edd618 Compare December 14, 2025 11:13
@Olovyannikov Olovyannikov force-pushed the new/prefer-single-binding branch from 7edd618 to 15906fe Compare December 14, 2025 11:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Rule: prefer-single-binding

1 participant