filterId increases forever, causing id mismatches for Images with tintColor

[Cauldrath]

Every image is assigned a unique "filterId", starting at zero and incrementing for each image. This number is never reset, so it will keep increasing forever. When running server-side, this will continue increasing until precision is lost. This also causes hydration issues, because the id for an image will not match between client and server, most obviously when the image has a tintColor specified. During hydration, you will get warnings like these:
Warning: Prop `style` did not match. Server: "-webkit-filter:url(#tint-265);filter:url(#tint-265)" Client: "-webkit-filter:url(#tint-17);filter:url(#tint-17)"

Warning: Prop `id` did not match. Server: "tint-265" Client: "tint-17"

How to reproduce

Steps to reproduce:

1. Create an application with server-side rendering that includes an Image with a tintColor style
2. Render a page a few times without restarting the server or application

Expected behavior
Filters should come back with the same id on every request.

Environment

• React Native for Web: 0.11.4
• React: 16.6.3
• Browser: Chrome 75.0.3770.100 / Node 8.15.0

Additional context

This is the line where the filterId is being incremented:

react-native-web/packages/react-native-web/src/exports/Image/index.js

Line 165 in 33dc3cb

filterId++;

It seems like the filterId value would need to be reset at some point.

[necolas]

Fixing this depends on this feature facebook/react#17322

[necolas]

When running server-side, this will continue increasing until precision is lost

I can't see that happening in practice

[Cauldrath]

When running server-side, this will continue increasing until precision is lost

I can't see that happening in practice

True, but it's theoretically possible given enough traffic on a page with enough images over an incredibly long time. The mismatch due to it incrementing forever is the real issue.