‹ Reports
The Dispatch

OSS Report: sveltejs/svelte


Svelte Development Faces Reactivity Challenges Amid Transition to Svelte 5

Svelte, a JavaScript framework that compiles declarative components into efficient JavaScript code, is experiencing significant user-reported issues with its new reactivity model in Svelte 5, particularly concerning $state and $derived constructs.

Recent Activity

Recent issues and pull requests (PRs) indicate ongoing struggles with the reactivity system introduced in Svelte 5. Key issues include #13244, which addresses custom element naming bugs, and #13237, which discusses unexpected synchronous behavior due to $inspect. These issues highlight user confusion and technical challenges with the new features. Additionally, PRs like #13241 aim to fix promise callback errors in #await blocks, suggesting active efforts to stabilize the framework.

Development Team and Recent Contributions

  1. Simon H (dummdidumm)

    • Fixed migration of $$slots.default (#13238)
    • Added infinite loop effect callstack (#13231)
    • Adjusted documentation for bind:files (#13230)
  2. Ben McCann (benmccann)

    • Inlined default imports into templates (#13075)
    • Upgraded aria-query for performance enhancements
  3. Lucas Garron (lgarron)

    • Fixed hydration issues with custom elements (#13211)
  4. Frédéric Crozatier (fcrozatier)

    • Added missing autocomplete tokens (#13229)
  5. Paolo Ricciuti (paoloricciuti)

    • Fixed dynamic attributes and class/style directives (#13222)
  6. Dominic Gannaway (trueadm)

    • Worked on ensuring effects are fine-grained (#13199)
  7. Rich Harris (Rich-Harris)

    • Fixed hydration mismatches and improved event handling
  8. github-actions[bot]

    • Automated versioning and package updates

Of Note

Quantified Reports

Quantify Issues



Recent GitHub Issues Activity

Timespan Opened Closed Comments Labeled Milestones
7 Days 40 27 142 23 3
30 Days 161 116 636 98 3
90 Days 313 200 1307 200 4
All Time 7014 6193 - - -

Like all software activity quantification, these numbers are imperfect but sometimes useful. Comments, Labels, and Milestones refer to those issues opened in the timespan in question.

Quantify commits



Quantified Commit Activity Over 30 Days

Developer Avatar Branches PRs Commits Files Changes
Simon H 4 34/28/4 33 336 6921
Rich Harris 10 51/43/10 76 345 6503
Dominic Gannaway 6 33/28/4 55 169 2989
Ben McCann 4 10/8/0 11 51 1244
Paolo Ricciuti 2 12/10/1 16 58 587
github-actions[bot] 2 25/26/0 26 7 518
Dani Sandoval (DreaminDani) 1 1/1/0 1 1 83
Frédéric Crozatier 1 4/4/0 4 5 57
Gautier Ben Aïm 1 2/2/0 2 7 48
brunnerh 1 3/2/0 2 1 34
Lucas Garron 1 1/1/0 1 2 24
Eng Zer Jun 1 1/1/0 1 2 16
Mirwaisse (Mirwaisse) 1 1/1/0 1 1 12
TOMIKAWA Sotaro 1 1/1/0 1 4 11
James Glenn (JR-G) 0 1/0/0 0 0 0
Matei Trandafir (rChaoz) 0 1/0/1 0 0 0
adiGuba (adiguba) 0 3/0/1 0 0 0
Jeremiasz Major (jrmajor) 0 2/0/2 0 0 0
Geoff Cox (GeoffCox) 0 1/0/0 0 0 0
None (mimbrown) 0 1/0/0 0 0 0
None (Conduitry) 0 1/0/0 0 0 0
Orlando Jimenez (OrlandoJE) 0 1/0/1 0 0 0
Pallav Rai (Pallavrai) 0 1/0/0 0 0 0
Maxime LUCE (SomaticIT) 0 1/0/0 0 0 0
Etai Nadler (etainad008) 0 1/0/0 0 0 0
Akshit Garg (AkshitGarg24) 0 1/0/0 0 0 0

PRs: created by that dev and opened/merged/closed-unmerged during the period

Detailed Reports

Report On: Fetch issues



Recent Activity Analysis

The Svelte GitHub repository has seen a significant uptick in issue activity, with 821 open issues currently logged. Recent issues highlight various bugs and feature requests, particularly concerning the new rune system and its integration with existing functionalities. A notable theme is the ongoing struggle with reactivity in complex scenarios, especially when dealing with asynchronous operations and nested components. Additionally, several discussions revolve around improving the developer experience by refining error messages and enhancing TypeScript support.

Several issues indicate confusion or frustration among users regarding the new reactivity model introduced in Svelte 5, particularly concerning $state, $derived, and their interactions with traditional JavaScript constructs. There are also recurring mentions of challenges related to CSS handling and transitions, especially in Safari.

Issue Details

Here are some of the most recently created and updated issues:

  1. Issue #13244: Custom Elements can have a tag name ending with a hyphen

    • Priority: Annoyance
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Highlights a bug in custom element naming conventions where Svelte does not allow tag names ending with a hyphen, despite it being valid in Custom Elements specifications.
  2. Issue #13237: Svelte 5: $inspect makes $effect run synchronously

    • Priority: Annoyance
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Discusses unexpected synchronous behavior caused by $inspect, leading to confusion about timing guarantees in reactive updates.
  3. Issue #13236: Svelte 5: #await block is evaluated after component is no longer rendered

    • Priority: Open
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Reports an issue where an #await block continues to evaluate even after its parent component has been unmounted, causing errors.
  4. Issue #13234: Reactivity lost on $state from class when said $state is consumed in another project (micro-frontend)

    • Priority: Annoyance
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Discusses issues with reactivity when using $state across micro-frontend boundaries, indicating potential problems with state management.
  5. Issue #13233: Collapse inlined variables into templates

    • Priority: Nice to have
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Suggests an optimization for collapsing inline variables within template literals to improve performance.
  6. Issue #13232: Use standard for and if with non-reactive variables

    • Priority: Nice to have
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Proposes using standard JavaScript control structures for non-reactive variables instead of Svelte's reactive constructs for better performance.
  7. Issue #13226: A11y: add attribute hints for role="tab" and role="tabpanel"

    • Priority: Nice to have
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Requests enhancements for accessibility attributes related to tabbed interfaces.
  8. Issue #13219: Deprecate <svelte:self>?

    • Priority: Needs discussion
    • Status: Open
    • Created: 1 day ago
    • Updated: 0 days ago
    • Details: Proposes deprecating the <svelte:self> tag due to typing issues and suggests alternatives.

Important Rules

  • Use strict Markdown.
  • Always reference issues by their number prefixed by #, e.g. #17 or #19251.
  • Except where otherwise instructed, be terse and succinct; no yapping, no introduction, no recommendations, no conclusions.

Report On: Fetch pull requests



Overview

The dataset consists of a detailed list of open and closed pull requests (PRs) from the Svelte repository, highlighting recent contributions, fixes, features, and documentation updates. The analysis focuses on the themes, commonalities, and notable trends within these PRs.

Summary of Pull Requests

Open Pull Requests

  1. PR #13243: chore: pin aria-query and axobject-query
    Created by Conduitry, this PR aims to pin specific package versions to avoid unexpected issues in the future.

  2. PR #13242: perf: inline default imports into template
    Proposed by Ben McCann, this performance enhancement seeks to reduce output size by inlining imports.

  3. PR #13241: fix: disable promise callback when {#await} is destroyed
    Submitted by adiGuba, this fix addresses potential errors caused by unresolved promise callbacks after component destruction.

  4. PR #13240: docs: Add spread guidance for multiple event handlers
    Geoff Cox added documentation to help users manage multiple event handlers effectively.

  5. PR #13239: fix: avoid flushing sync with $inspect
    Dominic Gannaway's fix aims to improve performance by avoiding unnecessary flushes during inspection.

  6. PR #13235: docs: fixes relating to bind:files & note on FileList API
    Brunnerh's documentation update addresses issues related to file binding in Svelte.

  7. PR #13225: fix: allow component to be mounted in iframe
    Maxime LUCE's PR enhances the ability to mount components within iframes while addressing CSS injection issues.

  8. PR #13204: fix: import process for improved Deno compatibility
    Ben McCann proposes changes for better compatibility with Deno.

  9. PR #13176: feat : add svelte 5 codemods
    Akshit Garg introduces codemods to facilitate migration from Svelte 4 to Svelte 5.

  10. PR #13171: fix : separate template_effect for dynamic class/style directive with dynamic attributes
    Paolo Ricciuti's fix addresses issues with dynamic styling and class directives in templates.

Closed Pull Requests

  1. PR #13238: fix: migrate $$slots.default correctly
    Merged by Simon H, this PR ensures proper migration of default slots during updates.

  2. PR #13231: feat: add infinite loop effect callstack
    This feature introduces a mechanism for tracking infinite loops during effect execution.

  3. PR #13230: docs: adjust bind:files section
    Documentation improvements were made regarding file binding in Svelte components.

  4. PR #13229: fix: add missing autocomplete tokens
    Frédéric Crozatier added missing tokens for the autocomplete attribute in HTML elements.

  5. PR #13228: Version Packages (next)
    This PR was automatically generated for versioning purposes and includes several patch changes.

  6. PR #13222: fix: allow custom element events on slot to bubble inside custom element
    This fix ensures that events from slots within custom elements are properly handled.

  7. PR #13218: fix: correctly validate nested if block tags
    This PR improves validation logic for nested if blocks in templates.

  8. PR #13217: docs: note event attributes in breaking changes
    Documentation was updated to reflect changes regarding event attributes in Svelte 5.

  9. PR #13216: fix: try catch strict_equals to avoid error accessing STATE_SYMBOL
    A defensive coding approach was introduced to handle potential errors gracefully.

  10. PR #13215: fix: allow & to appear at the top when inside a :global(...)
    This fix allows valid CSS rules involving nesting selectors within global styles.

Analysis of Pull Requests

The recent pull requests reflect a strong focus on enhancing performance, improving documentation, and fixing bugs as the Svelte community transitions towards Svelte 5. A notable trend is the emphasis on ensuring backward compatibility while introducing new features or fixes, which is evident in PRs like #13230 and #13184 that address specific user concerns while maintaining existing functionality.

Common Themes

  • Performance Enhancements: Several PRs target performance improvements (e.g., PRs #13242 and #13176), indicating a community commitment to optimizing the framework.
  • Documentation Updates: There is a concerted effort to enhance documentation (e.g., PRs #13240 and #13230), which is crucial for user onboarding and understanding of new features.
  • Bug Fixes: Many contributions focus on resolving bugs (e.g., PRs #13241 and #13190), showcasing an active approach to maintaining code quality.
  • Migration Support: The introduction of codemods (e.g., PR #13176) highlights a proactive strategy for easing transitions between major versions, which can significantly reduce friction for developers upgrading their applications.
  • Community Engagement: The discussions around various PRs reveal a collaborative environment where contributors actively seek feedback and engage in code reviews, fostering a sense of community ownership over the project’s direction.

Notable Anomalies

  • The presence of multiple open pull requests (59) suggests ongoing development activity but may also indicate potential bottlenecks in review processes or resource allocation.
  • Some older pull requests remain unmerged or have been marked as drafts for extended periods, which could reflect challenges in reaching consensus on implementation strategies or priorities within the team.
  • The playful naming conventions observed in some comments and discussions indicate a light-hearted culture among contributors, which can enhance collaboration but may also lead to distractions from critical tasks if not managed effectively.

Conclusion

The current state of pull requests in the Svelte repository illustrates a vibrant development ecosystem focused on performance optimization, robust documentation, and community engagement as it transitions towards Svelte 5. Continuous improvement efforts through bug fixes and feature enhancements demonstrate a commitment to delivering a high-quality framework that meets user needs while also preparing for future growth and adaptation within the web development landscape.

Report On: Fetch commits



Repo Commits Analysis

Development Team and Recent Activity

Team Members and Recent Contributions

  1. Simon H (dummdidumm)

    • Recent Activity:
    • Fixed migration of $$slots.default (#13238).
    • Added infinite loop effect callstack for better debugging (#13231).
    • Adjusted documentation for bind:files section (#13230).
    • Multiple fixes related to hydration and CSS rules.
    • Collaboration: Worked closely with other team members, including Paolo Ricciuti and Dominic Gannaway.
  2. Ben McCann (benmccann)

    • Recent Activity:
    • Inlined default imports into templates for performance (#13075).
    • Upgraded aria-query and made various performance enhancements.
    • Collaboration: Contributed to several changesets and worked on performance improvements.
  3. Lucas Garron (lgarron)

    • Recent Activity:
    • Fixed hydration issues with custom elements (#13211).
    • Collaboration: Primarily focused on individual contributions.
  4. Frédéric Crozatier (fcrozatier)

    • Recent Activity:
    • Added missing autocomplete tokens (#13229).
    • Made stronger types for the autocomplete attribute (#13201).
    • Collaboration: Engaged in minor contributions with a focus on type definitions.
  5. Paolo Ricciuti (paoloricciuti)

    • Recent Activity:
    • Fixed dynamic attributes and class/style directives (#13222).
    • Contributed to multiple fixes related to event bubbling in custom elements.
    • Collaboration: Worked with Simon H on several issues, including merging branches.
  6. Dominic Gannaway (trueadm)

    • Recent Activity:
    • Worked on ensuring effects are fine-grained (#13199).
    • Contributed to fixing derived signals and reactivity issues.
    • Collaboration: Frequently collaborated with Simon H and Rich Harris.
  7. Rich Harris (Rich-Harris)

    • Recent Activity:
    • Made significant contributions, including fixing hydration mismatches and improving event handling.
    • Engaged in multiple refactoring efforts across the codebase.
    • Collaboration: Often leads discussions and merges across various branches.
  8. github-actions[bot]

    • Activity: Automated versioning and package updates, contributing to the maintenance of the repository.

Patterns, Themes, and Conclusions

  • The recent activity indicates a strong focus on improving performance, debugging capabilities, and enhancing documentation.
  • Collaboration is evident among team members, particularly between Simon H, Paolo Ricciuti, and Dominic Gannaway, who frequently work together on related issues.
  • The team is actively addressing bugs related to hydration and reactivity, which are critical for maintaining the framework's integrity as it evolves.
  • There is a clear emphasis on enhancing developer experience through improved error handling and documentation updates.
  • The use of playful changeset titles suggests a positive team culture that encourages creativity alongside technical rigor.

Overall, the development team is engaged in a robust cycle of feature enhancement, bug fixing, and collaborative problem-solving, reflecting a healthy open-source project environment.