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

chore: fix contributing documentation #166

Merged
merged 7 commits into from
Apr 10, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@ We want this community to be **friendly and respectful** to each other. Please f

## Development workflow

To get started with the project, run `yarn bootsrap` in the root directory to install the required dependencies for each package:
To get started with the project, run `yarn` in the root directory to install the required dependencies for each package:

```sh
yarn bootsrap
yarn
```

> This project uses [`yarn`](https://classic.yarnpkg.com/) as a package manager. While it's possible to run individual commands with [`npm`](https://github.com/npm/cli), please refrain from using it, especially `npm install.` 🙅
Expand Down
4 changes: 2 additions & 2 deletions docs/docs/fundamentals/optimizing-long-running-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ The library can only provide you with tripwires that certain screens are not per

However, there is one common category of performance slowdown that is often seen in simple RN apps. If a React component runs for a long time synchronously before returning the renderable JSX, it may cause the navigation to slow down a little.

The `PerformanceMeasureView` can help you optimise such slow navigation animations by delaying the expensive renders until after the animation completes. It can show a lightweight placeholder view while that animation is occuring:
The `PerformanceMeasureView` can help you optimise such slow navigation animations by delaying the expensive renders until after the animation completes. It can show a lightweight placeholder view while that animation is occurring:

```tsx
<PerformanceMeasureView
Expand All @@ -19,6 +19,6 @@ The `PerformanceMeasureView` can help you optimise such slow navigation animatio
</PerformanceMeasureView>
```

It is highly encouraged to not use this flag blindly, since it can only optimize a very specific kind of perfomance slowdowns. Using it unnecessarily might actually slow things down even further, since you're adding 1 extra lightweight render pass before rendering the real expensive UI. Please visually verify thoroughly and monitor the render-time scores before opting in.
It is highly encouraged to not use this flag blindly, since it can only optimize a very specific kind of performance slowdowns. Using it unnecessarily might actually slow things down even further, since you're adding 1 extra lightweight render pass before rendering the real expensive UI. Please visually verify thoroughly and monitor the render-time scores before opting in.

This feature uses a ReactNative [`InteractionManager.runAfterInteractions`](https://reactnative.dev/docs/interactionmanager) call under-the-hood to schedule the real expensive render after all the animations are completed.
2 changes: 1 addition & 1 deletion fixture/src/examples/DrawerNavigator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {NavigationKeys} from '../constants';
/**
* This screen simulates an example where multiple screens can be
* mounted in parallel at the same time. Changes in one screen can affect
* some global state (through react context) that can cause a parallely
* some global state (through react context) that can cause a parallelly
* active screen to re-render.
*/

Expand Down
2 changes: 1 addition & 1 deletion fixture/src/examples/TabNavigator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import {NavigationKeys} from '../constants';
/**
* This screen simulates an example where multiple screens can be
* mounted in parallel at the same time. Changes in one screen can affect
* some global state (through react context) that can cause a parallely
* some global state (through react context) that can cause a parallelly
* active screen to re-render.
*/

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const createProfiledNavigation = ({

const profiledDispatch: typeof navigation.dispatch = action => {
// Note that the drawer navigator internally uses custom animated touchables
// that do not expose the native press timetamps. So we cannot
// that do not expose the native press timestamps. So we cannot
// compute the `timeToConsumeTouchEvent`.
if ('type' in action && action.type === 'NAVIGATE') {
startProfiler({
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ const prepareRenderPassStartInfo = async (flowStartState: Started): Promise<Rend
};
} else {
return {
// For in-app navagation, if the user had provided the uiEvent object, mark the
// For in-app navigation, if the user had provided the uiEvent object, mark the
// flowStartTimeSinceEpochMillis as when the native onPress event occurred. If that
// information is not available, fallback to the less accurate JS onPress event.
flowStartTimeSinceEpochMillis: await (flowStartState.timestamp.nativeTimestamp ??
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {ErrorHandler, ErrorHandlerContextProvider} from '../../../utils';

describe('state-machine/controller/state-controller-context', () => {
describe('useStateController', () => {
it('provides the state controller instance available throught the context', () => {
it('provides the state controller instance available through the context', () => {
const mockStateController = {
onSomeEvent: jest.fn(),
} as any;
Expand Down
Loading