Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add FAQ entry about client-side init functions #2965

Closed

Conversation

rmunn
Copy link
Contributor

@rmunn rmunn commented Dec 2, 2021

Demonstrate how to guarantee that a client-side initialization function will be called only once per client.

After writing this comment explaining how to call a library's init function only once on the client, I thought that that might be a generally-useful technique that should be documented. The FAQ section on integrations seems like the right place to put it.

No tests or changesets because this is a documentation-only PR. If a changeset should be added even to doc-only PRs, let me know and I'll be happy to add one.

Please don't delete this checklist! Before submitting the PR, please make sure you do the following:

  • It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
  • This message body should clearly illustrate what problems it solves.
  • Ideally, include a test that fails without this PR but passes with it.

Tests

  • Run the tests with pnpm test and lint the project with pnpm lint and pnpm check

Changesets

  • If your PR makes a change that should be noted in one or more packages' changelogs, generate a changeset by running pnpx changeset and following the prompts. All changesets should be patch until SvelteKit 1.0

Demonstrate how to guarantee that a client-side initialization function
will be called only once per client.
@changeset-bot
Copy link

changeset-bot bot commented Dec 2, 2021

⚠️ No Changeset found

Latest commit: e7b92b2

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@rmunn
Copy link
Contributor Author

rmunn commented Dec 2, 2021

The unit test failure is likely a flaky test that needs fixing, as it failed due to a timeout rather than an actual error. Plus, since this PR made no code changes, it's almost certainly not caused by the PR. I don't seem to have sufficient repo permissions to request a re-run of all jobs on the failing workflow, though. Someone with write access to the repo will probably have to do that.

@benmccann benmccann added the documentation Improvements or additions to documentation label Dec 2, 2021
@Rich-Harris
Copy link
Member

If no unsubscription is required, isn't this equivalent?

// clientConnection.ts
import { initalizeConnection } from 'some-library';
export const connection = initializeConnection('params');
import { connection } from '$lib/clientConnection.ts';
function getResult(query) {
	return connection.get(query);
}

Added a similar comment to #1538


```js
// clientConnection.ts
import { initalizeConnection } from 'some-library';
Copy link

@paolodina paolodina Jan 11, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

initalizeConnection typo

}
```

This technique uses the [initalization function of Svelte stores](https://svelte.dev/docs#svelte_store), which is called when the number of subscribers goes from zero to one (but not from one to two, etc) to set up a connection on demand. And because the connection is cached in an external variable, when one page unsubscribes from the store and a second page subscribes, the store's initialization function will be called again, but it will return the cached connection instead of creating a new one.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

initalization typo

@Rich-Harris
Copy link
Member

Going to close this as I don't think there's any advantage to the store-based approach — thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants