Skip to content

Conversation

@andrewvc
Copy link
Contributor

@andrewvc andrewvc commented Dec 6, 2019

Summary

This PR optimizes both the snapshot component and the monitor list on the overview page by using the new monitor.timespan field from elastic/beats#14778. Note that the functionality here will work with heartbeats lacking that patch, but the performance improvements will be absent.

This PR adapts the snapshot tests to use synthetically generated data which should be easier to maintain. As a result some of that code is refactored as well.

See #52433 parent issue as well.

Checklist

Use strikethroughs to remove checklist items you don't feel are applicable to this PR.

- [ ] This was checked for cross-browser compatibility, including a check against IE11
- [ ] Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support

For maintainers

@andrewvc andrewvc added enhancement New value added to drive a business result Team:Uptime - DEPRECATED Synthetics & RUM sub-team of Application Observability labels Dec 6, 2019
@andrewvc andrewvc self-assigned this Dec 6, 2019
@elasticmachine
Copy link
Contributor

Pinging @elastic/uptime (Team:uptime)

@andrewvc andrewvc added the WIP Work in progress label Dec 10, 2019
@andrewvc andrewvc changed the title Timespan optimization [Uptime] Improve query performance with Heartbeat 7.6+ data. Dec 11, 2019
@andrewvc andrewvc added review and removed WIP Work in progress labels Dec 11, 2019
Copy link
Contributor

@justinkambic justinkambic left a comment

Choose a reason for hiding this comment

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

I left a few comments, only one that I think is imperative. Once we've discussed these points I think we are pretty much there. I tested locally and the functionality seems to be working great, code looks good.

return i18n.translate('xpack.uptime.monitorList.statusColumn.downLabel', {
defaultMessage: 'Down',
});
case 'mixed':
Copy link
Contributor

Choose a reason for hiding this comment

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

nice seeing this code getting deleted

<EuiFlexItemAlignRight component="span">{content}</EuiFlexItemAlignRight>
<EuiFlexItemAlignRight
component="span"
data-test-subj={`xpack.uptime.donutChart.${message.toLowerCase()}`}
Copy link
Contributor

Choose a reason for hiding this comment

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

So, I've had some time to think this over and I think we may want a dedicated prop that makes the determination of what string to render here. The value that we pass to this component from its parent today isn't a constant string but rather the result of a translation call. This seems like it leaves the door open for some problematic value.

Instead we could just specify data-test-subj as an optional prop in the component's interface, and supply hardcoded string values in donut_chart_legend.tsx. WDYT?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Done in 5d789d0

Copy link
Contributor

Choose a reason for hiding this comment

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

I think I did a poor job explaining what I was looking for. Here're some modified snippets of what I had in mind, LMK what you think of this:

Chart Legend Row

This is where we need the attribute applied so the test utils can find our values:

interface Props {
  'data-test-subj': string;
  ...
}

export const DonutChartRow = ({
  'data-test-subj': dts,
  ...
}) => (
  <EuiFlexGroup ...>
    <EuiFlexItemAlignRight component="span" data-test-subj={dts}>
      {content}
    </EuiFlexItemAlignRight>
  </EuiFlexGroup>
);

Chart Legend

Then in here we could just hardcode the props as part of our component definition, and we won't be relying on the translated message strings for our attributes.

      <DonutChartLegendRow
        color={danger}
        content={down}
        message={i18n.translate('xpack.uptime.snapshot.donutChart.legend.downRowLabel', {
          defaultMessage: 'Down',
        })}
        data-test-subj="xpack.uptime.snapshot.donutChart.down"
      />
      <DonutChartLegendRow
        color={gray}
        content={up}
        message={i18n.translate('xpack.uptime.snapshot.donutChart.legend.upRowLabel', {
          defaultMessage: 'Up',
        })}
        data-test-subj="xpack.uptime.snapshot.donutChart.up"
      />

Doing it this way we will only be touching two files, and modifying the only components that should really care about these attributes; plus the full values are readable and searchable if someone is trying to trace these keys from the test files for some reason.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Ah, I see. My thinking is that we may want to reuse this donut chart elsewhere. By making this a prefix rather than the full subject, and passing it in from the top we could re-use the donut chart elsewhere and give it a separate data-test-subj namespace.

query: { bool: { filter: await context.dateAndCustomFilters() } },
aggs: {
unique: {
cardinality: { field: 'monitor.id', precision_threshold: 40000 },
Copy link
Contributor

Choose a reason for hiding this comment

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

It might be clearer to declare a constant like MAX_SUPPORTED_PRECISION_THRESHOLD to make it clearer why we've chosen 40000 as the value for precision_threshold.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I'll add a comment here. 40k is actually the max precision the cardinality aggregation supports. We want max precision here, and the storage tradeoff is fine since we don't have a ton of buckets.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Copy link
Contributor

Choose a reason for hiding this comment

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

40k is actually the max precision the cardinality aggregation supports

Yep, that's why I wanted some indication in case the reader of the code is unaware; this way they'll understand the choice and not think it's some arbitrary magic number. 👍

}

// @ts-ignore
const tsStart = DateMath.parse(this.dateRangeEnd).subtract(10, 'seconds');
Copy link
Contributor

Choose a reason for hiding this comment

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

I can see us potentially wanting to make the window size an API parameter in the future.

},
{
bool: {
must_not: { exists: { field: 'monitor.timespan' } },
Copy link
Contributor

Choose a reason for hiding this comment

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

TIL must_not ignores scoring.

);
expectFixtureEql(apiResponse.body, 'snapshot');
});
const dateRangeStart = new Date().toISOString();
Copy link
Contributor

@justinkambic justinkambic Jan 7, 2020

Choose a reason for hiding this comment

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

Having looked at the internals and now seeing these declarations, I think we can eventually specify just one date (end time) and a number of seconds to subtract from it for our API calls.

I'm realizing this is false - we still need the full window size for things like date histograms.

@andrewvc andrewvc force-pushed the timespan-optimization branch from b394a19 to 4eb1ab2 Compare January 8, 2020 20:55
Copy link
Contributor

@justinkambic justinkambic left a comment

Choose a reason for hiding this comment

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

LGTM WFG!

@kibanamachine
Copy link
Contributor

💚 Build Succeeded

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

@andrewvc andrewvc merged commit 2d15b8c into elastic:master Jan 9, 2020
@andrewvc andrewvc deleted the timespan-optimization branch January 9, 2020 14:36
andrewvc added a commit to andrewvc/kibana that referenced this pull request Jan 9, 2020
…#52433)



This PR optimizes both the snapshot component and the monitor list on the overview page by using the new monitor.timespan field from elastic/beats#14778. Note that the functionality here will work with heartbeats lacking that patch, but the performance improvements will be absent.

This PR adapts the snapshot tests to use synthetically generated data which should be easier to maintain. As a result some of that code is refactored as well.

See elastic#52433 parent issue as well.
andrewvc added a commit that referenced this pull request Jan 9, 2020
…#54352)

This PR optimizes both the snapshot component and the monitor list on the overview page by using the new monitor.timespan field from elastic/beats#14778. Note that the functionality here will work with heartbeats lacking that patch, but the performance improvements will be absent.

This PR adapts the snapshot tests to use synthetically generated data which should be easier to maintain. As a result some of that code is refactored as well.

See #52433 parent issue as well.
@andrewvc andrewvc removed their assignment Jan 16, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New value added to drive a business result release_note:enhancement review Team:Uptime - DEPRECATED Synthetics & RUM sub-team of Application Observability test-plan v7.6.0

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants