feat(filter-metadata): Filtered google lib metadata

[nutboltu]

This PR excluded following metadata to reduce the bundle size.
It's unlikely to use these meta.

1. noInternationalDialling
2. fixedLine
3. uan
4. tollFree
5. premiumRate
6. sharedCost
7. voip
8. personalNumber
9. pager
10. voicemail

Also minified the dist/libphonenumber.js file

[superhit0]

will be needing more time to review further.

I have given some initial thoughts

[superhit0]

@nutboltu can you also remove the sub module python-gflags as well?

its not required for development

[superhit0]

Note to me: Lets look at the diff of the our generated files & this https://github.com/googlei18n/libphonenumber/blob/master/javascript/i18n/phonenumbers/metadatalite.js

[superhit0]

@nutboltu
there is a problem with removing these metadatas:: the isvalidnumber starts giving wrong answers, for example we removed fixed line, then I tested a fixed line number from India, it said invalid, even though it was valid.

The element in printed array shows the value of isValid

Local:

Live:

[nutboltu]

@superhit0 This is the starting point. I think we need to list down the number type and other metadata which we will remove from the validation.

I tried adding fixed line and it works fine for your given example. In a broader view. we can remove
uan, tollFree, premiumRate, sharedCost, voip, personalNumber, pager, voicemail and also leadingDigits.

[superhit0]

Also, we need to strengthen the tests in the repo, before we merge this one, I will try adding tests with different types of phonenumber as well.

@nutboltu @patw0929 I would request you guys to do the same as well please.

[nutboltu]

@superhit0 I tested it in react-intl-tel-input. Now it only supports mobile and fixed line. Is it okay not to support rest?

[superhit0]

@nutboltu whats the file size now?

[nutboltu]

@superhit0 Currect file size is ~179KB

[nutboltu]

downgrading node version in CI. jestjs/jest#8069

[superhit0]

hmm for 40 KB should we remove logics for different types of phones?
@patw0929 @nutboltu what do you think?

[nutboltu]

If we also remove fixed line it will down to ~139KB. It upon us what we want to keep and what we don't.

[superhit0]

Thats the thing right ?
we cannot remove fixed line as most of the offices have fixed line numbers

[nutboltu]

@patw0929 , @superhit0
I would like to explain the facts. Previously our react-intl-tel-input@5.0.1 had a bundle size of 72.7KB. But now after incorporating this libphonenumber-js-utils, the size increases to 286.9KB.

This fact is we are only using following functions from this library.

• formatNumber
• getExampleNumber
• getExtension
• getNumberType
• isValidNumber

But there's no tree shaking in the bundle. Considering those functions, I would say we can keep

• formatNumber
• getExtension
• getNumberType

I am not sure what's the benefits of keeping getExampleNumber. Giving an example provided by google may not necessary. And this may reduce the bundle size.

Now the main reason behind this huge bundle size is this isValidNumber function. I can say every developer validates the phone number in the backend as well and keeping this validation in the client side caused ~160KB size data. Still if we want to keep the validation, instead of using this google compiler I would suggest to build our own compiler using google metadata. (e.g: libphonenumber-js).

There's few possible solution I can say:

1. Build our own compiler using google metadata.
2. Use libphonenumber-js. react-phone-number-input is using this library.
3. Reduce the supported number type. Because very few people are using the following type of number.
   • noInternationalDialling
   • uan
   • tollFree
   • premiumRate
   • sharedCost
   • voip
   • personalNumber
   • pager
   • voicemail

We can only support mobile and fixedLine for now which will reduce ~40 KB. It's really a down side when we load this component in a slow internet connection. We should consider it seriously.

[nutboltu]

@patw0929 any thoughts about this PR?

[patw0929]

Sweet! 🙌 I agree with you that we should consider reducing the bundle size.

Just curious, what's the difference between the three solutions you listed above?
If we choose to use libphonenumber-js instead, is the approach also support mobile & fixed line only? And how big is the bundle size?
We need more information to make a decision.

[nutboltu]

@patw0929

1. For the 1st solution we need to build our own compiler using google metadata. In this case, we can keep updated with google metadata like libphonenumber-js. It's kind of rebuilding libphonenumber-js in our own way.

2. For the 2nd solution, it's a dependency to this package.
   They only support mobile. see this line
   https://github.com/catamphetamine/libphonenumber-js/blob/5678d38e64d314d75dad994f67fd833f347551eb/source/tools/generate.js#L35
   Their bundle size is 27.9Kb (https://bundlephobia.com/result?p=libphonenumber-js@0.2.2)

3. 3rd solution is this PR where we specify the supported number type.

[patw0929]

Thank you for your detailed explanation! 👍

If we only want to support mobile, maybe we can just use libphonenumber-js, for convenience.

I personally think it is worthy to support mobile & fixed line.
So if you guys has same thought, then which solution is better for the maintenance? And pros & cons?
Or if we choose 3rd solution (this PR), what's next? Is it ready for merge?
Thanks!

[nutboltu]

@patw0929 This PR is to support only mobile and fixed line. Please review this so that we can merge

[patw0929]

Looks great to me!

[nutboltu]

@patw0929 , @superhit0 are we happy to merge this PR?

Can you please review again?

[nutboltu]

@patw0929 I am going to merge this PR.