JavaScript Applications for the Enterprise: Building for3D VisualizationProduction with the ArcGIS API for JavaScript George Bochenek Randy Jones @bosshenek @randysjones gzip

Always and Forever Best Practices

http://www.docnrolla.com/codex/css-image-sprites-google-best-practice.php https://tse2.mm.bing.net/th?id=OIP.a2zYlvdmT2zDiTQFHCjlqQHaEK&pid=Api PageSpeed Insights Lighthouse https://developers.google.com/speed/pagespeed/insights/

Apache (GAE) Internet Information Services (IIS) lighttpd Nginx Node.js H5BP Server-Configs https://github.com/h5bp/server-configs If you build it they will come… https://developers.arcgis.com/javascript/latest/guide/using-webpack/

https://github.com/esri/arcgis-webpack-plugin "devDependencies": { "clean-webpack-plugin": "^2.0.0", "copy-webpack-plugin": "^5.0.0", "css-loader": "^2.1.0", "html-loader": "^0.5.5", "html-webpack-plugin": "^3.2.0", "mini-css-extract-plugin": "^0.5.0", "raw-loader": "^1.0.0", "uglifyjs-webpack-plugin": "^2.1.2", "webpack": "^4.29.6", "webpack-cli": "^3.2.3", "webpack-dev-server": "^3.2.1" }, "dependencies": { "@arcgis/webpack-plugin": "^4.10.5" } Legacy App Integration Tips and Tricks

• Relative Paths Are Easier • require(“buildProject/buildProject”) becomes require(“./buildProject”)

• Old School Templated Widgets

• Static Config • Use CopyWebpackPlugin Setup Your Apps with a CLI https://github.com/Esri/arcgis-js-cli What About Web AppBuilder?

https://github.com/gbochenek/esri-wab-build Continuous Integration Separate Your Code

generate create git

Copy watch Web AppBuilder widget Dev Edition

https://github.com/Esri/generator-esri-appbuilder-js Source Control the Right Things

generate Widget create Project gitgit

Copy watch watch Web AppBuilder widget Dev Edition

Config Copy Project git configs

https://github.com/Esri/generator-esri-appbuilder-js Web AppBuilder Pipeline

Template Widget Submodule Config App w/All create Project git Project git git Widgets

Web AppBuilder Copy to app directory Dev Edition

App to App.zip deploy build

https://github.com/rsjones/wab-config https://github.com/rsjones/wab-widget Related Talks

Unit Testing with the JavaScript API • Thursday // 1:00 – 2:00 • Catalina / Medera • George Bochenek / Randy Jones

Web AppBuilder for ArcGIS: Advanced Development Tools and Techniques • Thursday // 5:30 – 6:30 • Catalina / Medera • George Bochenek / Gavin Rehkemper Resources

• 2018 Dev Summit Building for Production Talk: • https://www.youtube.com/watch?v=KGJs4au30Zk

• Google Lighthouse: • https://developers.google.com/web/tools/lighthouse/

• ArcGIS WebPack Plugin: • https://github.com/esri/arcgis-webpack-plugin • https://developers.arcgis.com/javascript/latest/guide/using-webpack/

• Building Web AppBuilder: • https://github.com/gbochenek/esri-wab-build

• @arcgis/cli • https://github.com/Esri/arcgis-js-cli Please Take Our Survey on the App

Download the Esri Events Select the session Scroll down to find the Complete answers app and find your event you attended feedback section and select “Submit”