FirebaseExtended / FirebaseExtended/reactfire

Reactfire preventing lazy loading of firebase modules

Đang mở
#488 7 bình luận 1 reaction 1 người được giao Được @jhuleatt nhận Xem trên GitHub
v5
Ngôn ngữ chính
TypeScript
Star
3.6k
Fork
403
Merge trung bình
14 giờ 53 phút
Pull request đã merge (30 ngày)
5

Mô tả

When using ReactFire I want to lazy load Firestore to reduce build initial build size and improve load times. When using ReactFire lazy loading firestore does not happen even while using `import('firebase/firestore')`.

I have included a version that does not use ReactFire with working lazy loading as shown by the initialisation time.
I have also included a version that does use ReactFire where I am trying to use lazy loading but I believe it is not working.

I noticed this in a Nextjs project with the bundle analyzer but haven't included Nextjs in the examples for simplicity.

### Version info

**React:** 17.02

**Firebase:** 9.4.1

**ReactFire:** 4.2.1

### Test case

Test case without using ReactFire and lazy loading working:
https://codesandbox.io/s/blissful-scott-05qj6?file=/src/App.tsx
https://csb-9c5hc.netlify.app/

Test case with using ReactFire and lazy loading not working:
https://codesandbox.io/s/elegant-roentgen-2iyt8?file=/src/App.tsx
https://csb-2iyt8.netlify.app/

You can use the network tab to see that 6 networks requests are made without ReactFire but only 5 are made with using it, you can also see the breakdown of chunks in the lighthouse analysis.

[Lighthouse Treemap without ReactFire](https://googlechrome.github.io/lighthouse/treemap/?gzip=1#H4sIAAAAAAAAE51Xy27jNhT9lUCrDmBLJCWKYlZtZ5btKs2qCAY0dW0zI1EqSSUxAv97KXsy0INy1VmK5D33de5D71F1NNH9e2Tgnw6sg/LRVNF9dHSutfdJIu1uyyU9yliDq9T+FIu2TaJNtFdaVCvfiq5UzvZarDSqdVtnAGrRbkvhRH+sSg8TuttETrkK/O3D5fbur+vt3ZfrbQlXKdVo/+bRQnm3b8zdd4w7r98/srIxHkJ3VfX944uybSVOfzZlD620l6mFUy9wgXRCVRdr3ant7ycWaS/lr/9+j7SoYY3/BmzTGQm/n1wvSVLCzpuV4tZ5w2TybJM0FgWlUEgRy2Onv8XPNoDNOKN4E3W688H4OKS8yNNNJI+qKg3oofFxnPQOfa2bsqsgiEgpozPEAhMcRvx1rwzshIUQVsoxmWHlPOVhrB7KOp+xpFTWJUqX8BaDrQnCLOx/ijgvphow96eDkL/CTh6F1lBtX42PMpi1+BnhOJvAp6zI0PlpgN+aRoK1yc40rxZMEAnnfUpGQBgXZITzS6fr3rzyU8ASzPKpPMvG8mupReLd3jMEcXSDWpgigthEJbu6EWZWACMrCjw1m+EsJ/8Do0DZNAUY5XSBQtbIOUaOEJpAUB/QMIJstA+VdjZ2IUYUM7rlaJADaU6tC0qSIiBKh7Il7MEYKMPi+awqczIQhrqrhK+doDDN5v4PNYN+UabRNeiw7UU2Nd2fDOWNaUw4YHk6tZuSbCDa7J7D/vJZ5+BDf2VTtyJs7YwvGR7ViW+CQZpggshU1Bu7QNbegEYvRSyb9Q0yivhtlmGU8XGDeVElhHObslmZ4hynk1BdLP3qtfpxpxeQaDYDYiMzPMH62flHcziAeQDzoiSEbcJ82jVxPkCqLggLeUfTjkHSdMgYpR0Yv46E486mTOfZOqJSggcPP6bab227UBG36SlaFc4szqb1gPNhsgwc/GwC89mPwc8fiVtiyXT0YzyKUz/egukZlcPyOzKec7c3B5wixhZqxYCQLtAb8n46hASe7dvWdNqpGsLTic0c+M9nMvQip8U0kRnBC7vOxY3YV2PZyX4JjWulg3opn9GjRx2l2UNth26ugM0vi8fTbWTfUMFDC2vVQSfLseGzXpemxczCsqlDJC4uTScUo2WFhKTjbCQ/VKxx3ivNill7poSxWUSup6MFsBXyW7LrvL1KJ4eq2fn+EdSSDqvYyiP0dDeBRpPyhU1oPR2TH/hrApClsxWQB5wPneWoQOnqXRP7tX3a3BD+qVWz9tMmJryg+3x/60cGI4rC0bw24Le5CBtNlI8mFnhYkJV+E9rv00/n83nTz+e9OjyAc0ofLr+HVSNFdV2Wto8PkX/1L4gw8ppODwAA)
[Lighthouse Treemap with ReactFire](https://googlechrome.github.io/lighthouse/treemap/?gzip=1#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)

This is quite a big blocker for me so any help would be appreciated.

### Steps to reproduce

Open the two codesandbox's/netlify deployments above.

### Expected behavior

Firestore is loaded in a separate chunk.

### Actual behavior

Firestore is loaded in the initial chunk.

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.