mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Rick Hanlon
fb8e6610e5
Summary:
This diff improves LogBox performance by not storing and updating logs that are ignored.
Previous we stored all logs, including ignored, as a set. This was so that later, when we show a list of all logs, we would be able to show the ignored logs as well if toggled on. We stored the logs as:
```
const logs = new Set([
{
message: "Not ignored",
ignored: false,
},
{
message: "Ignored",
ignored: true,
},
// 100s more ignored logs
]);
```
But it turns out, we can have hundreds of ignored logs within seconds in some parts of the app. This means we we're re-rendering the LogBoxContainer hundreds of times with a filter on this set to filter out the ignored logs, just to change none of the content.
Now we store as:
```
const logs = new Set([
{
message: "Not ignored",
},
]);
```
Later, when we want to show ignored logs, we'll store these separately.
Changelog: [Internal]
Reviewed By: cpojer
Differential Revision: D18055799
fbshipit-source-id: f5e21f66bb4ab6137d5d3908e8c03e119e3805d5
65 lines
1.5 KiB
JavaScript
65 lines
1.5 KiB
JavaScript
/**
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
* @emails oncall+react_native
|
|
* @flow
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
const React = require('react');
|
|
const LogBoxContainer = require('../LogBoxContainer').default;
|
|
const LogBoxLog = require('../../Data/LogBoxLog').default;
|
|
const render = require('../../../../jest/renderer');
|
|
|
|
describe('LogBoxContainer', () => {
|
|
it('should render null with no logs', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
onDismiss={() => {}}
|
|
onDismissAll={() => {}}
|
|
logs={new Set()}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render the latest log', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
onDismiss={() => {}}
|
|
onDismissAll={() => {}}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
{
|
|
content: 'Some kind of message',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message',
|
|
[],
|
|
),
|
|
new LogBoxLog(
|
|
{
|
|
content: 'Some kind of message (latest)',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message (latest)',
|
|
[],
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
});
|