Locker Service Ready Lightning Components With Webpack

Feb 15, 2018Download as PPTX, PDF1 like3,019 views

In this talk you will learn: How to structure your JS-heavy project in Salesforce DX How to structure your JS-heavy project in Salesforce DX Learn how to use all the familiar JS tools with Webpack and Lightning

Locker Service Ready Lightning
Components With Webpack
Writing modern JavaScript with dependencies
in a safe and platform-compatible way
marat@salesforce.com, @MaratVy
Marat Vyshegorodtsev, Lead Application Security Engineer

In this talk you will learn
How to structure your JS-heavy project in Salesforce DX
Artifacts!
How to build Locker Service-compatible JS bundles using Webpack
You may know Webpack from ReactJS development, but it is not its only use!
Learn how to use all the familiar JS tools with Webpack and Lightning
Linting, depolyfilling and more!

Remember this article? You may forget it now
https://sfdc.co/locker

Let’s try a random broken lib from StackExchange question
choices.js — the lib of choice

The reason? Broken Internet Explorer polyfill
choices.js/assets/scripts/src/lib/polyfills.js

Let’s apply some
SFDX and Webpack magic!

What is my modern Salesforce stack in 2017?
Salesforce Developer Experience (DX)
Source-driven deployments a la Heroku
Lightning + Salesforce Design System + Locker + Stricter CSP Critical Update
Enable all usability and security features
ECMAScript 6+ with Webpack 3 + Babel + ESLint with Salesforce rules
Modern JavaScript development with freedom to choose the libraries
Bleeding edge platform technologies

Salesforce DX Artifact Structure
Aura Classes Objects Layouts
Static Resources == Webpack Artifacts
…
JavaScript CSS
BowerES6 NPM Bower
SCSS
LESS
NPM

Salesforce DX Artifact Structure
Lightning Component
Webpack Project

Webpack Configuration for Lightning
Output two static resources: App.resource and Styles.resource
Package code as a library with window library target
Fix all Locker-broken imports: global variables, this instead of window
Lint code for Lightning issues
Transpile ES6+ to browser-compatible JS

Configure JS Output
Produces a single app.resource with all Javascript

Configure CSS Output
Produces a single styles.resource with all CSS

Fix Legacy Libraries
Referencing this when meaning window is not compatible with Locker Service:
Use imports-loader

Un-polyfill Locker Objects
Locker Service has custom implementations for many DOM APIs. Do not polyfill them.

Fix UMD and AMD Imports
Webpack wraps UMD call to this nicely so that libraries like Choices.js just work
For AMD packages disable define using imports-loader:
imports-loader?define=>false

Transpile Modern JS to Browser-Compatible
Use babel-loader with babel-preset-env
In package.json configure:
“browserlist”: “last 2 versions”
https://sfdc.co/browsers

Check for Lightning Issues in JS
Use eslint-loader with @salesforce/eslint-plugin-aura in .eslintrc

Projects mentioned
@salesforce/eslint-plugin-aura
touzoku/df17-demo

Check out my VisualForce work too!
@salesforce/eslint-plugin-visualforce
forcedotcom/eslint-plugin-visualforce

Attend these theater sessions today!
1:30pm Common Web Security Vulnerabilities and Their Fixes
Learn more about Open Redirect and XSS
2:00pm Avoiding Common Security Mistakes
Learn more about SOQL injection and CSRF

Locker Service Ready Lightning Components With Webpack

Replace Angular with React. Make the move from the MEAN stack to the powerful MERN Stack! Come and learn about the MERN stack. No, that isn't a typo. The MERN stack is Mongo, Express, and Node, with React instead of Angular. While both React and Angular are remarkable JavaScript technologies, React comes with less baggage. There is no TypeScript, no annotations, no bossy framework telling you how to do everything.

.NET Fest 2018. Dino Esposito. ASP.NET Blazor—the C# Angular or the return of...NETFest

About a decade ago the mainstream Web stopped at a crossroad: JavaScript or native code? Silverlight was all the rage for a few years but then HTML5 won and Angular/React/Vue—all purely JS frameworks—have become mainstream. Today, Blazor comes up as a possible alternative to Angular/React/Vue and thanks to WebAssembly it opens up the web to be able to take advantage of existing development ecosystems, including .NET. Blazor is, to some extent, a modern attempt to revamp and refine the Silverlight concept—bringing the power of C# to client-side web development. In this session, I’ll discuss the underlying system architecture of an ASP.NET Blazor application and present a few examples.

Mini-Training Owin KatanaBetclic Everest Group Tech Team

This document provides a summary of the history of ASP.NET and the motivation for OWIN and Katana. It discusses how ASP.NET has evolved from ASP in 1996 to include MVC in 2009 and Web API in 2012. This led to a desire for frameworks that are not dependent on IIS and can be more modular. OWIN was created as an open standard to provide an abstraction between web servers and frameworks. Katana is Microsoft's implementation of OWIN. It presents an overview of how OWIN and Katana work using an environment dictionary and application delegate. The document concludes with a demo showing how to create a simple "Hello World" app using OWIN and Katana both with IIS and by self-host

Introduction to MERNShyamMohanKunwar

Node js projects💾 Radek Fabisiak

In this article, I’d like to tell you about 7 Node JS project ideas that will help you train your skills, build an impressive portfolio, and get hired. For some time, I’m publishing the lists of projects that you can use to practice the coding skills that you’ve just learned. I was focusing mostly on frontend technologies, but today I decided to jump to the Javascript backend framework called Node JS.

Create simple api using node jsEdwin Andrianto

Node.js is a JavaScript runtime that allows for building scalable network applications easily. It uses an event-driven and non-blocking model that makes it lightweight and efficient for data-intensive real-time applications across distributed devices. The document provides steps for creating a simple RESTful API using Node.js, Express, MongoDB, and other tools, including downloading Node.js, creating a project structure, and defining routes for CRUD operations on data.

BlazorSandun Perera

Blazor v1.1Juan Luis Guerrero Minero

This document provides an overview of Web Assembly (WASM) and Blazor. It discusses how WASM allows code to run in browsers without plugins and is optimized for speed and size. Examples of WASM usage include games, video editors, and CAD tools. Blazor is introduced as a framework that runs .NET code in browsers using WASM. It follows an MVVM pattern and enables two-way data binding. The document compares Blazor to other technologies and provides resources for learning more.

Mern stack developementkalyankumar836878

MERN is one of several MEAN stack (MongoDB Express Angular Node) variants in which the traditional Angular.js frontend framework is replaced with React.js. MEVN (MongoDB, Express, Vue, Node) is another variant, and really any frontend JavaScript framework can work.Node.js is a popular and powerful JavaScript server platform, and Express.js is a server-side web framework. Regardless of which variant you choose, ME(RVA)N is the best way to work with JavaScript and JSON from start to finish. DURATION:60 days

Full stack development tools & technologieskumar satyam

This document discusses full-stack development tools and technologies using MERN and Python pipelines. It introduces MERN which involves React.js, Node.js, MongoDB and Express.js. The MERN and Python pipelines are described involving frontend, backend, database and authentication technologies. Key terms used in the pipelines like Express.js, Mongoose.js, Django, Flask, JWT, sessions and API keys are defined. The document also briefly discusses dependencies of React.js like bundle.js and the React ecosystem.

Introduction to MERN StackSurya937648

This document discusses the MERN stack, which is a framework that uses MongoDB, Express, React, and Node.js for building full-stack web applications. It describes each component and how they work together. MongoDB is the database, Express is the backend framework, React is the frontend framework, and Node.js is the runtime environment. The MERN stack allows building a 3-tier architecture (frontend, backend, database) entirely in JavaScript. It offers benefits like scalability, speed, and the ability to use JavaScript throughout the stack.

Node js (runtime environment + js library) platformSreenivas Kappala

This document provides an overview of Node.js, including what it is, its features, advantages, limitations, and how to use related tools like npm and Express.js. Node.js is a JavaScript runtime environment that allows building fast and scalable server-side web applications. It uses non-blocking I/O and event-driven architecture, making it suitable for data-intensive real-time applications. Common uses of Node.js include building APIs and web servers. Related modules like npm and Express.js provide functionality for package/module management and creating web app frameworks.

Node js Global Packagessanskriti agarwal

Architecture of Professionals.azziyaaskerov

MEAN Stack - Google Developers Live 10/03/2013Valeri Karpov

Flask jwt authentication tutorialKaty Slemon

You know what iMEAN? Using MEAN stack for application dev on InformixKeshav Murthy

GROOVY ON GRAILSziyaaskerov

This document summarizes a presentation about the Grails framework. It discusses how Grails allows building modern Java web applications quickly using Groovy and conventions over configuration. Key features highlighted include GORM for object-relational mapping, GSP for views, and integration with Spring and other Java technologies. The document also provides overviews of Grails tags, plugins including Spring Security, and configuration options.

Evolution / History of ASP.NETAnoop Kumar Sharma

The MEAN Stack: MongoDB, ExpressJS, AngularJS and Node.jsMongoDB

Laravel developmentdeepikadigital1

Getting Started With WP REST APIKishor Kumar

This document summarizes a workshop on getting started with the WordPress REST API. It provides information on: 1. The facilitators - Kishor Kumar Mahato, Abiral Neupane, and Ashok Maharjan from Eagle Vision IT who will present for 25 minutes and run a 1 hour and 20 minute workshop. 2. An overview of topics to be covered including why use JSON REST API, introducing REST and JSON, setting up the WordPress REST API server and client, and performing CRUD operations with GET, POST, PUT, and DELETE verbs. 3. A presentation on REST principles including representations, uniform interface, statelessness and links between resources to provide context for the WordPress

Salesforce Apex Hours : Node red for salesforceAmit Chaudhary

NodeRED, a top level OpenSource project of the JavaScript foundation, too follows the philosophy "Clicks, not code" we all got to love in Salesforce. The talk will introduce NodeRED, what it is, what it can do and how to use it in conjunction with use cases for Salesforce. Agenda: - Introduction to NodeRED: nodes, flows, runtime - Talking to Salesforce: SOSL, SOQL, DML, Streaming & Chatter - Use cases with Salesforce - Q&A

Webpack DataArt

This document discusses JavaScript modules and module bundlers like Webpack. It describes the purposes of JavaScript modules as encapsulation, organization, avoiding global scope pollution, and reusability. It then covers different ways to define modules, including using global variables, AMD, CommonJS, and ES6 modules. Webpack is introduced as a module bundler that can bundle modules, implement code splitting to optimize loading, and use loaders to treat different file types as modules. Webpack's plugin system and development tools are also discussed.

Java Microservices with Spring Boot and Spring Cloud - Denver JUG 2019Matt Raible

A lightning talk I gave at the Denver JUG meetup on December 11, 2019. This presentation shows how to build a secure microservices architecture with Spring Boot and Spring Cloud. It also shows you how you can generate the same architecture using JHipster. It's based on three blog posts I wrote: * https://developer.okta.com/blog/2019/05/22/java-microservices-spring-boot-spring-cloud * https://developer.okta.com/blog/2019/05/23/java-microservices-spring-cloud-config * https://developer.okta.com/blog/2019/08/28/reactive-microservices-spring-cloud-gateway

Latest Javascript MVC & Front End Frameworks 2017AmarInfotech

Node js Introductionsanskriti agarwal

Node.js is an open source JavaScript runtime environment used to build real-time web applications. The document introduces Node.js, the npm package manager, the Express web application framework, and how to connect a Node.js application to MongoDB. Key points covered include Node.js being single-threaded and event-driven, using npm to install and use packages locally or globally, Express providing features for building web apps and APIs, and using modules like Mongoose to connect a Node app to MongoDB.

Webpack/Parcel: What’s Happening Behind the React App?Talentica Software

Introduction of webpack 4Vijay Shukla

More Related Content

What's hot (20)

Blazor v1.1Juan Luis Guerrero Minero

Mern stack developementkalyankumar836878

Full stack development tools & technologieskumar satyam

Introduction to MERN StackSurya937648

Node js (runtime environment + js library) platformSreenivas Kappala

Node js Global Packagessanskriti agarwal

Architecture of Professionals.azziyaaskerov

MEAN Stack - Google Developers Live 10/03/2013Valeri Karpov

Flask jwt authentication tutorialKaty Slemon

You know what iMEAN? Using MEAN stack for application dev on InformixKeshav Murthy

GROOVY ON GRAILSziyaaskerov

Evolution / History of ASP.NETAnoop Kumar Sharma

The MEAN Stack: MongoDB, ExpressJS, AngularJS and Node.jsMongoDB

Laravel developmentdeepikadigital1

Getting Started With WP REST APIKishor Kumar

Salesforce Apex Hours : Node red for salesforceAmit Chaudhary

Webpack DataArt

Java Microservices with Spring Boot and Spring Cloud - Denver JUG 2019Matt Raible

Latest Javascript MVC & Front End Frameworks 2017AmarInfotech

Node js Introductionsanskriti agarwal

Blazor v1.1Juan Luis Guerrero Minero

Mern stack developementkalyankumar836878

Full stack development tools & technologieskumar satyam

Introduction to MERN StackSurya937648

Node js (runtime environment + js library) platformSreenivas Kappala

Node js Global Packagessanskriti agarwal

Architecture of Professionals.azziyaaskerov

MEAN Stack - Google Developers Live 10/03/2013Valeri Karpov

Flask jwt authentication tutorialKaty Slemon

You know what iMEAN? Using MEAN stack for application dev on InformixKeshav Murthy

GROOVY ON GRAILSziyaaskerov

Evolution / History of ASP.NETAnoop Kumar Sharma

The MEAN Stack: MongoDB, ExpressJS, AngularJS and Node.jsMongoDB

Laravel developmentdeepikadigital1

Getting Started With WP REST APIKishor Kumar

Salesforce Apex Hours : Node red for salesforceAmit Chaudhary

Webpack DataArt

Java Microservices with Spring Boot and Spring Cloud - Denver JUG 2019Matt Raible

Latest Javascript MVC & Front End Frameworks 2017AmarInfotech

Node js Introductionsanskriti agarwal

More from Salesforce Engineering (20)

Scaling HBase for Big DataSalesforce Engineering

Techniques to Effectively Monitor the Performance of Customers in the CloudSalesforce Engineering

This document discusses techniques for effectively monitoring customer performance in the cloud. It recommends establishing a baseline for normal performance and monitoring metrics and thresholds to detect deviations. Key metrics to track include counts, medians, percentiles, and distributions over time. Dashboards should visualize these metrics and allow comparing performance across different time periods. An example dashboard monitors adoption, errors, and metrics over the last 30 days and compares to the same day last week. The presentation demonstrates an Einstein Analytics dashboard for interactive analysis across devices.

Predictive System Performance Data AnalysisSalesforce Engineering

Apache HBase State of the ProjectSalesforce Engineering

Hit the Trail with TrailheadSalesforce Engineering

HBase/PHOENIX @ ScaleSalesforce Engineering

This document summarizes Salesforce's use of HBase and Phoenix for storing and querying large volumes of structured and unstructured data at scale. Some key details: 1) Salesforce heavily uses HBase and Phoenix for both customer-facing and internal use cases, including storing login data, user activity, thread dumps, and more. 2) Salesforce operates over 100 HBase clusters of varying sizes to support over 4 billion write requests and 600 million read requests per day, totaling over 80 terabytes of data written and 500 gigabytes read daily. 3) An example use case is a central metrics database collecting data from over 80,000 machines, storing 11.4 trillion metrics and growing, with

Scaling up data science applicationsSalesforce Engineering

Containers and Security for DevOpsSalesforce Engineering

Cem Gurkok presented on containers and security. The presentation covered threats to containers like container exploits and tampering of images. It discussed securing the container pipeline through steps like signing, authentication, and vulnerability scans. It also covered monitoring containers and networks, digital forensics techniques, hardening containers and hosts, and vulnerability management.

Aspect Oriented Programming: Hidden Toolkit That You Already HaveSalesforce Engineering

This document provides an overview of aspect-oriented programming (AOP) and various AOP implementations. It begins with an introduction to AOP concepts like cross-cutting concerns. It then discusses the AOP frameworks AspectJ and Spring AOP, covering their pointcut and advice anatomy. The document also examines how AOP can be used for code coverage, benchmarks, improved compilation, and application monitoring. It analyzes implementations like JaCoCo, JMH, HotswapAgent, and AppDynamics as examples.

Monitoring @ Scale in SalesforceSalesforce Engineering

Performance Tuning with XHProfSalesforce Engineering

This document discusses using XHProf to perform performance tuning of PHP applications. It begins with an introduction of the speaker and their company Pardot. It then provides an overview of XHProf including how to install, configure, and use it to profile PHP applications. The document outlines various performance tips for PHP such as optimizing array operations, managing memory efficiently, and improving database queries. It also walks through some examples of profiling a sample Symfony application that involves getting click data from a database. The examples demonstrate how to optimize queries and object hydration to improve performance.

A Smarter Pig: Building a SQL interface to Pig using Apache CalciteSalesforce Engineering

This document summarizes a presentation about building a SQL interface for Apache Pig using Apache Calcite. It discusses using Calcite's query planning framework to translate SQL queries into Pig Latin scripts for execution on HDFS. The presenters describe their work at Salesforce using Calcite for batch querying across data sources, and outline their process for creating a Pig adapter for Calcite, including implementing Pig-specific operators and rules for translation. Lessons learned include that Calcite provides flexibility but documentation could be improved, and examples from other adapters were helpful for their implementation.

Implementing a Content Strategy Is Like Running 100 MilesSalesforce Engineering

The document discusses implementing a content strategy and outlines some key lessons learned. It notes that implementing a content strategy is like running a long distance and will involve pain, relationships, and focusing on strengths over weaknesses. It advises getting ready for the pain involved, not trying to do it alone, and leveraging strengths rather than weaknesses. The presentation encourages the audience to take action by volunteering or taking the next step.

Salesforce Cloud Infrastructure and Challenges - A Brief OverviewSalesforce Engineering

Koober Preduction IO PresentationSalesforce Engineering

Koober is an open-source interactive website that uses machine learning models trained on historical taxi and weather data to visualize past taxi demand and predict future demand. It generates datasets by clustering taxi pickup locations and extracting features from the data, then builds models using techniques like gradient-boosted trees and neural networks. The website integrates these predictions with interactive maps to help the taxi industry optimize operations and better meet customer needs based on past trends.

Finding Security Issues Fast!Salesforce Engineering

MicroservicesSalesforce Engineering

This document discusses microservices and the process of setting up a new microservice. It covers topics such as defining the service scope, getting approvals, source control and packaging, running environments, logging and monitoring, and preparing the service for production use. The key aspects of setting up a new microservice include buy-in from management, external design reviews, source control and deployment automation, provisioning compute and storage resources, and integrating the service with monitoring and on-call systems.

Global State Management of Micro ServicesSalesforce Engineering

This document discusses using Apache Zookeeper to orchestrate microservice deployments. It describes how Zookeeper can be used to define service topology, enable one-button deployments through a coordinator service called Maestro, and ensure high availability and failure recovery. The Maestro coordinator initiates and manages deployments by monitoring global state in Zookeeper and determining which nodes to deploy next. Maestro agents on each node receive notifications, create execution plans to deploy updates, and publish status to Zookeeper. Different propagation strategies like canary deployments and rollback capabilities provide health mediation during deployments.

The Future of HbaseSalesforce Engineering

Apache BookKeeper Distributed Store- a Salesforce use caseSalesforce Engineering

Scaling HBase for Big DataSalesforce Engineering

Techniques to Effectively Monitor the Performance of Customers in the CloudSalesforce Engineering

Predictive System Performance Data AnalysisSalesforce Engineering

Apache HBase State of the ProjectSalesforce Engineering

Hit the Trail with TrailheadSalesforce Engineering

HBase/PHOENIX @ ScaleSalesforce Engineering

Scaling up data science applicationsSalesforce Engineering

Containers and Security for DevOpsSalesforce Engineering

Aspect Oriented Programming: Hidden Toolkit That You Already HaveSalesforce Engineering

Monitoring @ Scale in SalesforceSalesforce Engineering

Performance Tuning with XHProfSalesforce Engineering

A Smarter Pig: Building a SQL interface to Pig using Apache CalciteSalesforce Engineering

Implementing a Content Strategy Is Like Running 100 MilesSalesforce Engineering

Salesforce Cloud Infrastructure and Challenges - A Brief OverviewSalesforce Engineering

Koober Preduction IO PresentationSalesforce Engineering

Finding Security Issues Fast!Salesforce Engineering

MicroservicesSalesforce Engineering

Global State Management of Micro ServicesSalesforce Engineering

The Future of HbaseSalesforce Engineering

Apache BookKeeper Distributed Store- a Salesforce use caseSalesforce Engineering

Recently uploaded (20)

ADVXAI IN MALWARE ANALYSIS FRAMEWORK: BALANCING EXPLAINABILITY WITH SECURITYijscai

With the increased use of Artificial Intelligence (AI) in malware analysis there is also an increased need to understand the decisions models make when identifying malicious artifacts. Explainable AI (XAI) becomes the answer to interpreting the decision-making process that AI malware analysis models use to determine malicious benign samples to gain trust that in a production environment, the system is able to catch malware. With any cyber innovation brings a new set of challenges and literature soon came out about XAI as a new attack vector. Adversarial XAI (AdvXAI) is a relatively new concept but with AI applications in many sectors, it is crucial to quickly respond to the attack surface that it creates. This paper seeks to conceptualize a theoretical framework focused on addressing AdvXAI in malware analysis in an effort to balance explainability with security. Following this framework, designing a machine with an AI malware detection and analysis model will ensure that it can effectively analyze malware, explain how it came to its decision, and be built securely to avoid adversarial attacks and manipulations. The framework focuses on choosing malware datasets to train the model, choosing the AI model, choosing an XAI technique, implementing AdvXAI defensive measures, and continually evaluating the model. This framework will significantly contribute to automated malware detection and XAI efforts allowing for secure systems that are resilient to adversarial attacks.

new ppt artificial intelligence historyyyPianoPianist

Value Stream Mapping Worskshops for Intelligent Continuous SecurityMarc Hornbeek

Data Structures_Searching and Sorting.pptxRushaliDeshmukh2

Explainable-Artificial-Intelligence-XAI-A-Deep-Dive (1).pptxMahaveerVPandit

Artificial Intelligence (AI) basics.pptxaditichinar

MAQUINARIA MINAS CEMA 6th Edition (1).pdfssuser562df4

introduction to machine learining for beginersJoydebSheet

IntroSlides-April-BuildWithAI-VertexAI.pdfLuiz Carneiro

Introduction to Zoomlion Earthmoving.pptxAS1920

Lidar for Autonomous Driving, LiDAR Mapping for Driverless Cars.pptxRishavKumar530754

Oil-gas_Unconventional oil and gass_reseviours.pdfM7md3li2

Data Structures_Introduction to algorithms.pptxRushaliDeshmukh2

Concept of Problem Solving, Introduction to Algorithms, Characteristics of Algorithms, Introduction to Data Structure, Data Structure Classification (Linear and Non-linear, Static and Dynamic, Persistent and Ephemeral data structures), Time complexity and Space complexity, Asymptotic Notation - The Big-O, Omega and Theta notation, Algorithmic upper bounds, lower bounds, Best, Worst and Average case analysis of an Algorithm, Abstract Data Types (ADT)

Development of MLR, ANN and ANFIS Models for Estimation of PCUs at Different ...Journal of Soft Computing in Civil Engineering

Passenger car unit (PCU) of a vehicle type depends on vehicular characteristics, stream characteristics, roadway characteristics, environmental factors, climate conditions and control conditions. Keeping in view various factors affecting PCU, a model was developed taking a volume to capacity ratio and percentage share of particular vehicle type as independent parameters. A microscopic traffic simulation model VISSIM has been used in present study for generating traffic flow data which some time very difficult to obtain from field survey. A comparison study was carried out with the purpose of verifying when the adaptive neuro-fuzzy inference system (ANFIS), artificial neural network (ANN) and multiple linear regression (MLR) models are appropriate for prediction of PCUs of different vehicle types. From the results observed that ANFIS model estimates were closer to the corresponding simulated PCU values compared to MLR and ANN models. It is concluded that the ANFIS model showed greater potential in predicting PCUs from v/c ratio and proportional share for all type of vehicles whereas MLR and ANN models did not perform well.

211421893-M-Tech-CIVIL-Structural-Engineering-pdf.pdfinmishra17121973

The Gaussian Process Modeling Module in UQLabJournal of Soft Computing in Civil Engineering

We introduce the Gaussian process (GP) modeling module developed within the UQLab software framework. The novel design of the GP-module aims at providing seamless integration of GP modeling into any uncertainty quantification workflow, as well as a standalone surrogate modeling tool. We first briefly present the key mathematical tools on the basis of GP modeling (a.k.a. Kriging), as well as the associated theoretical and computational framework. We then provide an extensive overview of the available features of the software and demonstrate its flexibility and user-friendliness. Finally, we showcase the usage and the performance of the software on several applications borrowed from different fields of engineering. These include a basic surrogate of a well-known analytical benchmark function; a hierarchical Kriging example applied to wind turbine aero-servo-elastic simulations and a more complex geotechnical example that requires a non-stationary, user-defined correlation function. The GP-module, like the rest of the scientific code that is shipped with UQLab, is open source (BSD license).

15th International Conference on Computer Science, Engineering and Applicatio...IJCSES Journal

Avnet Silica's PCIM 2025 Highlights FlyerWillDavies22

Smart Storage Solutions.pptx for production engineeringrushikeshnavghare94

Introduction to FLUID MECHANICS & KINEMATICSnarayanaswamygdas

Fluid mechanics is the branch of physics concerned with the mechanics of fluids (liquids, gases, and plasmas) and the forces on them. Originally applied to water (hydromechanics), it found applications in a wide range of disciplines, including mechanical, aerospace, civil, chemical, and biomedical engineering, as well as geophysics, oceanography, meteorology, astrophysics, and biology. It can be divided into fluid statics, the study of various fluids at rest, and fluid dynamics. Fluid statics, also known as hydrostatics, is the study of fluids at rest, specifically when there's no relative motion between fluid particles. It focuses on the conditions under which fluids are in stable equilibrium and doesn't involve fluid motion. Fluid kinematics is the branch of fluid mechanics that focuses on describing and analyzing the motion of fluids, such as liquids and gases, without considering the forces that cause the motion. It deals with the geometrical and temporal aspects of fluid flow, including velocity and acceleration. Fluid dynamics, on the other hand, considers the forces acting on the fluid. Fluid dynamics is the study of the effect of forces on fluid motion. It is a branch of continuum mechanics, a subject which models matter without using the information that it is made out of atoms; that is, it models matter from a macroscopic viewpoint rather than from microscopic. Fluid mechanics, especially fluid dynamics, is an active field of research, typically mathematically complex. Many problems are partly or wholly unsolved and are best addressed by numerical methods, typically using computers. A modern discipline, called computational fluid dynamics (CFD), is devoted to this approach. Particle image velocimetry, an experimental method for visualizing and analyzing fluid flow, also takes advantage of the highly visual nature of fluid flow. Fundamentally, every fluid mechanical system is assumed to obey the basic laws : Conservation of mass Conservation of energy Conservation of momentum The continuum assumption For example, the assumption that mass is conserved means that for any fixed control volume (for example, a spherical volume)—enclosed by a control surface—the rate of change of the mass contained in that volume is equal to the rate at which mass is passing through the surface from outside to inside, minus the rate at which mass is passing from inside to outside. This can be expressed as an equation in integral form over the control volume. The continuum assumption is an idealization of continuum mechanics under which fluids can be treated as continuous, even though, on a microscopic scale, they are composed of molecules. Under the continuum assumption, macroscopic (observed/measurable) properties such as density, pressure, temperature, and bulk velocity are taken to be well-defined at "infinitesimal" volume elements—small in comparison to the characteristic length scale of the system, but large in comparison to molecular length scale

ADVXAI IN MALWARE ANALYSIS FRAMEWORK: BALANCING EXPLAINABILITY WITH SECURITYijscai

new ppt artificial intelligence historyyyPianoPianist

Value Stream Mapping Worskshops for Intelligent Continuous SecurityMarc Hornbeek

Data Structures_Searching and Sorting.pptxRushaliDeshmukh2

Explainable-Artificial-Intelligence-XAI-A-Deep-Dive (1).pptxMahaveerVPandit

Artificial Intelligence (AI) basics.pptxaditichinar

MAQUINARIA MINAS CEMA 6th Edition (1).pdfssuser562df4

introduction to machine learining for beginersJoydebSheet

IntroSlides-April-BuildWithAI-VertexAI.pdfLuiz Carneiro

Introduction to Zoomlion Earthmoving.pptxAS1920

Lidar for Autonomous Driving, LiDAR Mapping for Driverless Cars.pptxRishavKumar530754

Oil-gas_Unconventional oil and gass_reseviours.pdfM7md3li2

Data Structures_Introduction to algorithms.pptxRushaliDeshmukh2

Development of MLR, ANN and ANFIS Models for Estimation of PCUs at Different ...Journal of Soft Computing in Civil Engineering

211421893-M-Tech-CIVIL-Structural-Engineering-pdf.pdfinmishra17121973

The Gaussian Process Modeling Module in UQLabJournal of Soft Computing in Civil Engineering

15th International Conference on Computer Science, Engineering and Applicatio...IJCSES Journal

Avnet Silica's PCIM 2025 Highlights FlyerWillDavies22

Smart Storage Solutions.pptx for production engineeringrushikeshnavghare94

Introduction to FLUID MECHANICS & KINEMATICSnarayanaswamygdas

Locker Service Ready Lightning Components With Webpack

1. Locker Service Ready Lightning Components With Webpack Writing modern JavaScript with dependencies in a safe and platform-compatible way [email protected], @MaratVy Marat Vyshegorodtsev, Lead Application Security Engineer

2. In this talk you will learn How to structure your JS-heavy project in Salesforce DX Artifacts! How to build Locker Service-compatible JS bundles using Webpack You may know Webpack from ReactJS development, but it is not its only use! Learn how to use all the familiar JS tools with Webpack and Lightning Linting, depolyfilling and more!

3. Remember this article? You may forget it now https://sfdc.co/locker

4. Let’s try a random broken lib from StackExchange question choices.js — the lib of choice

5. The reason? Broken Internet Explorer polyfill choices.js/assets/scripts/src/lib/polyfills.js

6. Let’s apply some SFDX and Webpack magic!

7. What is my modern Salesforce stack in 2017? Salesforce Developer Experience (DX) Source-driven deployments a la Heroku Lightning + Salesforce Design System + Locker + Stricter CSP Critical Update Enable all usability and security features ECMAScript 6+ with Webpack 3 + Babel + ESLint with Salesforce rules Modern JavaScript development with freedom to choose the libraries Bleeding edge platform technologies

8. Salesforce DX flow

9. Salesforce DX Artifact Structure Aura Classes Objects Layouts Static Resources == Webpack Artifacts … JavaScript CSS BowerES6 NPM Bower SCSS LESS NPM

10. Salesforce DX Artifact Structure Lightning Component Webpack Project

11. Webpack Configuration for Lightning Output two static resources: App.resource and Styles.resource Package code as a library with window library target Fix all Locker-broken imports: global variables, this instead of window Lint code for Lightning issues Transpile ES6+ to browser-compatible JS

12. Configure JS Output Produces a single app.resource with all Javascript

13. Configure CSS Output Produces a single styles.resource with all CSS

14. Fix Legacy Libraries Referencing this when meaning window is not compatible with Locker Service: Use imports-loader

15. Un-polyfill Locker Objects Locker Service has custom implementations for many DOM APIs. Do not polyfill them.

16. Fix UMD and AMD Imports Webpack wraps UMD call to this nicely so that libraries like Choices.js just work For AMD packages disable define using imports-loader: imports-loader?define=>false

17. Transpile Modern JS to Browser-Compatible Use babel-loader with babel-preset-env In package.json configure: “browserlist”: “last 2 versions” https://sfdc.co/browsers

18. Check for Lightning Issues in JS Use eslint-loader with @salesforce/eslint-plugin-aura in .eslintrc

19. Voila!

20. Projects mentioned @salesforce/eslint-plugin-aura touzoku/df17-demo

21. Check out my VisualForce work too! @salesforce/eslint-plugin-visualforce forcedotcom/eslint-plugin-visualforce

22. Attend these theater sessions today! 1:30pm Common Web Security Vulnerabilities and Their Fixes Learn more about Open Redirect and XSS 2:00pm Avoiding Common Security Mistakes Learn more about SOQL injection and CSRF

Editor's Notes

#6: No browser detection for polyfill breaks the proper CustomEvent object in SecureWindow object. Just search for CustomEvent in the source code given the error from the previous slide

Locker Service Ready Lightning Components With Webpack

Recommended

More Related Content

What's hot (20)

Similar to Locker Service Ready Lightning Components With Webpack (20)

More from Salesforce Engineering (20)

Recently uploaded (20)

Locker Service Ready Lightning Components With Webpack

Editor's Notes