react-native-fontawesome icon indicating copy to clipboard operation
react-native-fontawesome copied to clipboard

React-native bundle time increased from 30 seconds to 20 minutes.

Open herbertvuijk opened this issue 2 years ago • 0 comments

Describe the bug After adding some icons into my project I found that the react-native build gets extremely slow

yarn react-native bundle --entry-file index.js --platform ios --dev false --reset-cache --bundle-output ios/main.jsbundle --verbose

After 2 days of Googling and researching I realized that my built slowed down after adding RN FA. I waited it out, the bundling, and noticed that it had EVERY FA icon in the index.js. So the index.js became really big, and hence was slowing down a lot.

I changed to deep imports:

import { faCircle } from '@fortawesome/pro-thin-svg-icons/faCircle'; import { faCompass } from '@fortawesome/pro-thin-svg-icons/faCompass'; import { faUser } from '@fortawesome/pro-thin-svg-icons/faUser';

And that seemed to have speed up the build again. Obviously this is very frustrating behavior that lost me 2 days of work, before I understood what was going wrong.

Reproducible test case

  • New react-native project Import some icons like so: import { library } from '@fortawesome/fontawesome-svg-core' import { faList, faLocationSmile, faLightbulb, faCircleCheck, faLocationArrow, faLocationPin, faArrowUp, faThumbsDown, faCheck, faGauge, faLocationPlus, faTrash, faFaceFrown, faFaceMeh, faFaceSmileBeam, faArrowUpLong, faArrowsMaximize, faChevronsRight, faInboxOut, faInboxIn, faArrowUpFromLine, faPlaneDeparture, faArrowsLeftRight, faGaugeSimpleMax, faLifeRing, faUserPlus, faLocationDot, faRocket, faLocationCrosshairs, faPenToSquare, faCrown, faCamera, faChartBar, faArrowRight, faPen, faExclamationTriangle, faInfoCircle, faMagnifyingGlass, faSortUp, faSortDown, faCassetteTape, faTrophyStar, faBatteryBolt, faArrowRightArrowLeft, faPlus, faRectangleHistory, faUmbrellaBeach, faWind, faThermometerHalf, faBell, faUserFriends, faGear, faShareNodes, faCalendarDays, faArrowDown, faChevronRight, faWatch, faUserTie, faFilter, faTvRetro, faCircle, faCompass, faUser, faUsers, faPaperPlane, faBullseye, faBullhorn, faUserCrown, faStar, faClock, faXmark

} from '@fortawesome/pro-thin-svg-icons';

Expected behavior My built should still work

herbertvuijk avatar Dec 03 '23 14:12 herbertvuijk