M.A.M.

SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

Department of Artificial Intelligence and Data Science

Academic Year 2024-2025 (Odd Semester)
Unit - III
Sub.Code/Sub.Name : CCS332 – App Development Date :
Year/Sem. : III / V

Answer All the Questions

Part A (10x2=20 Marks)
List the key features of Native, hybrid and web app.

Native apps include direct hardware access, platform-specific performance optimization, seamless
integration with device features,
1.
while Hybrid apps offer cross-platform compatibility using a single codebase, faster development time,
and access to some native features through plugins, and

Web apps are accessible through a browser, are generally lighter, and focus on responsive design
across different devices;
Define Ionic.

Ionic is a powerful hybrid app development framework that allows developers to create cross-platform
2.
mobile applications using web technologies such as HTML, CSS, and JavaScript. It provides tools,
components, and libraries that facilitate the process of building apps that work seamlessly on both iOS
and Android devices.
What is meant by Hybrid App Development?

3. A hybrid app is a versatile solution in the realm of mobile applications, bridging the gap between
native and web-based approaches. Developed using a combination of web technologies like HTML,
CSS, and JavaScript, hybrid apps are then encapsulated within a native container.
List out uses of Flutter Development Framework.

Developed by Google, Flutter has garnered attention for its unique approach to hybrid app
4. development, emphasizing a consistent and visually appealing user interface across platforms. Flutter
uses the Dart programming language and offers a comprehensive collection of widgets that contribute
to its expressive UI framework.

Mention the disadvantages of Hybrid Application Development.

5. Potential performance issues compared to native apps, difficulty achieving a fully native look and feel,
limited access to device features without plugins, reliance on frameworks, increased app size,
complexity in debugging, and potential inconsistency in user experience across different platforms;
List out the examples of hybrid app development.

6. Using frameworks like Ionic, React Native, or Xamarin to build cross-platform applications
that can run on both iOS and Android devices, with a single codebase primarily written in
web technologies like HTML, CSS, and JavaScript, allowing for faster development and
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

deployment across multiple platforms; popular examples of hybrid apps built this way
could be: Instagram, Twitter (X), Alibaba, Walmart, and Uber
Mention the advantages of Ionic Development Framework

A single codebase for cross-platform development, rapid development speed, native-

7.
like user experience, easy access to device features through Cordova plugins, a large
community support, and simplified maintenance due to the ability to update one
codebase across all platforms, significantly reducing development time and costs.
List of hybrid mobile application development frameworks with their pros and cons.

1. React Native:
 Pros:
Large community, familiar JavaScript syntax (based on React), good performance, ability to
access native components, hot reloading for fast development.
 Cons:
Can sometimes have performance issues on complex UI, potential learning curve for non-
React developers.
2. Ionic:
 Pros:
Easy to learn, uses standard web technologies (HTML, CSS, JavaScript), large ecosystem of
plugins, good for building simple to medium complexity apps.
 Cons:
May have performance limitations for demanding apps, native look and feel might not be as
8. robust as fully native apps.
3. Xamarin:
 Pros:
Excellent native performance, uses C# for cross-platform development, deep integration with
Microsoft tools, good for complex apps.
 Cons:
May require a steeper learning curve for developers not familiar with C#, potential
performance overhead due to the abstraction layer.
4. Flutter:
 Pros:
High performance, fast development cycles, rich UI toolkit, unique rendering engine for
consistent look across platforms.
 Cons:
Requires learning Dart programming language, potential compatibility issues with older
devices.

List out uses of Ionic Development Framework.

Build cross-platform mobile applications rapidly using web technologies like HTML, CSS, and
9. JavaScript, allowing developers to create apps for both iOS and Android with a single codebase,
providing a fast and efficient way to develop mobile UIs with access to native device features through
plugins when needed

Mention the advantages of Hybrid Application Development.

10.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
Cost-efficiency due to a single codebase for multiple platforms, faster development time, easier
maintenance with web technologies like HTML and CSS, wider reach across different operating
systems, and the ability to provide offline functionality through local storage;

Part B (5x16=80 Marks)

Explain Hybrid Web App, Benefits of Hybrid App, Criteria for creating Native App with example.

A hybrid app is a versatile solution in the realm of mobile applications, bridging the
gap between native and web-based approaches. Developed using a combination of web
technologies like HTML, CSS, and JavaScript, hybrid apps are then encapsulated within a
native container. This approach allows developers to write a single codebase that can be
deployed across different platforms, such as iOS and Android, significantly reducing
development time and costs.

Benefits of hybrid app

Hybrid apps offer several benefits due to their unique combination of web and native
technologies. Here's a detailed look at these advantages:

1. Cross-Platform Development: One of the major benefits of hybrid apps is their ability
to run on multiple platforms with a single codebase. This significantly reduces
development time and costs compared to building separate native apps for each
platform.

11 2. Faster Development: Hybrid apps leverage web technologies like HTML, CSS, and
JavaScript, which are widely known and used by developers. This familiarity speeds
up the development process as developers don't need to learn platform-specific
languages.

3. Code Reusability: With a single codebase for multiple platforms, developers can reuse
a significant portion of their code, maintaining consistency and reducing the risk of
bugs across different versions of the app.

4. Easy Updates: Unlike native apps that require users to download updates, hybrid apps
can update content and features dynamically without requiring users to install new
versions. This is particularly advantageous for content-heavy apps.
Criteria for creating hybrid app

Creating a hybrid app involves combining elements of both native and web applications. The
decision to create a hybrid app depends on several criteria:

1. Target Platforms: Hybrid apps use web technologies like HTML, CSS, and
JavaScript, making it easier to target multiple platforms (iOS, Android, web) with a
single codebase.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

2. Development Speed: Hybrid apps often have faster development cycles since
developers can reuse code across platforms.

3. Cost Efficiency: Building a single app for multiple platforms can be more cost-
effective than creating separate native apps.

4. Access to Device Features: Hybrid apps can access native device features through
plugins or libraries, but certain complex features might require more effort to
integrate.

5. UI/UX Complexity: For apps with simple UI and basic user interactions, a hybrid
approach may work well. Complex animations and intricate UI might perform better
in native apps.

Tools for creating hybrid app

Tools commonly used for creating hybrid apps:

1. Frameworks:

• Ionic: A popular open-source framework based on Angular and Apache

Cordova. It provides a rich set of UI components, themes, and plugins, making
it suitable for building visually appealing apps.

• React Native: While often associated with native development, React Native
allows developers to build hybrid apps using React, a JavaScript library. It
offers near-native performance and a strong community.

• Flutter: Although primarily known for creating native apps, Flutter offers the
ability to build web and desktop apps, making it a versatile choice. It uses Dart
programming language and provides a single codebase for multiple platforms.

2. Integrated Development Environments (IDEs):

• Visual Studio Code: A lightweight and highly customizable code editor that
supports various extensions for hybrid app development with frameworks like
Ionic and React Native.

• Android Studio: If you're building hybrid apps that will primarily target
Android, Android Studio with plugins can be used to integrate Cordova and
React Native projects.

Describe the frameworks, Ionic, Apache Cordova in detail with example.

12
Ionic is a powerful hybrid app development framework that allows developers to create
cross-platform mobile applications using web technologies such as HTML, CSS, and
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
JavaScript. It provides tools, components, and libraries that facilitate the process of building
apps that work seamlessly on both iOS and Android devices. Ionic leverages the capabilities
of Apache Cordova (formerly known as PhoneGap) to bridge the gap between web
technologies and native device features.

1. UI Components and Themes: Ionic provides a comprehensive library of pre-designed

UI components that follow the design guidelines of both iOS and Android platforms.
These components are customizable and allow developers to create visually appealing
and user-friendly interfaces.

2. Cross-Platform Compatibility: One of Ionic's core strengths is its ability to create apps
that run on multiple platforms with a single codebase. This eliminates the need to
develop separate apps for iOS and Android, saving time and effort.

3. Cordova Plugins Integration: Ionic seamlessly integrates with Cordova plugins,

enabling access to native device features like camera, geolocation, storage, and more.
These plugins bridge the gap between web technologies and native functionalities,
allowing developers to create feature-rich apps.
4. Ionic CLI (Command Line Interface): The Ionic CLI offers a set of commands that
simplify various development tasks, such as generating components, building, and
deploying the app. It accelerates the development process and provides a consistent
workflow.

Development framework that allows developers to build cross-platform mobile applications

using web technologies such as HTML, CSS, and JavaScript. Cordova bridges the gap
between web applications and native mobile device functionalities, enabling developers to
create apps that can run on various platforms, including iOS, Android, Windows, and more.
Core Concepts of Cordova:

1. Hybrid Apps: Cordova enables the creation of hybrid apps, which are a combination
of web technologies and native device capabilities. Unlike native apps that are
developed for a specific platform, hybrid apps leverage web views to render the user
interface while accessing native device features through Cordova plugins.

2. Web Technologies: Cordova apps are built using standard web technologies such as
HTML, CSS, and JavaScript. This means that developers familiar with web
development can leverage their skills to create mobile applications.
3. Native Functionality: Cordova provides a mechanism for accessing native device
features such as the camera, geolocation, contacts, file system, and more. These features
are exposed through plugins, allowing developers to use JavaScript APIs to interact with
native code.
4. Web Views: Cordova uses native web views to display the user interface. These web
views are essentially embedded browsers that render HTML and CSS. The interaction
between the web view and native code is facilitated by a bridge.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
Discuss the tools of hybrid app.

1. Frameworks:

• Ionic: A popular open-source framework based on Angular and Apache

Cordova. It provides a rich set of UI components, themes, and plugins, making
it suitable for building visually appealing apps.

• React Native: While often associated with native development, React Native
allows developers to build hybrid apps using React, a JavaScript library. It
offers near-native performance and a strong community.

• Flutter: Although primarily known for creating native apps, Flutter offers the
ability to build web and desktop apps, making it a versatile choice. It uses Dart
programming language and provides a single codebase for multiple platforms.

2. Integrated Development Environments (IDEs):

• Visual Studio Code: A lightweight and highly customizable code editor that
supports various extensions for hybrid app development with frameworks like
Ionic and React Native.

• Android Studio: If you're building hybrid apps that will primarily target
13 Android, Android Studio with plugins can be used to integrate Cordova and
3. Build Tools:

• Apache Cordova: An open-source platform for building hybrid mobile apps

using web technologies. It provides a command-line interface (CLI) to
package and deploy apps to different platforms.

• Expo: Built on top of React Native, Expo is a development platform that

simplifies the React Native workflow. It offers a range of tools to handle
building, testing, and deploying your hybrid app.

4. Testing Tools:

• Appium: An open-source mobile application testing tool that supports hybrid

apps. It allows you to automate testing across different platforms and devices.

• Jest: A widely used JavaScript testing framework that works well with React
Native and other hybrid app frameworks.

5. Version Control:

• Git: Essential for version control and collaboration among developers.

Platforms like GitHub and GitLab provide repositories for hosting and
managing hybrid app projects.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

6. Package Managers:

• npm (Node Package Manager): Used to manage and install packages (libraries,
plugins, modules) for your hybrid app's development.

7. UI Libraries:

• Material-UI (React): Provides a set of components following Google's

Material Design principles, which can be used to create consistent UI across
hybrid apps.

• Ionic UI Components: For Ionic-based apps, the framework includes a

comprehensive set of pre-designed UI components for creating visually
appealing interfaces.

8. Debugging Tools:

• Chrome DevTools: Useful for debugging hybrid apps as they are often web-
based. You can inspect elements, monitor network activity, and debug
JavaScript code.

• React Native Debugger: Specifically designed for debugging React Native

apps, offering advanced debugging features.

9. Plugins and Libraries:

• Cordova Plugins: Extend the capabilities of your hybrid app by integrating

native device functionalities like camera, geolocation, and more.
• React Native Libraries: A vast collection of open-source libraries available via
npm, enhancing your app's functionality and UI.
These tools collectively provide a comprehensive environment for developing, testing, and
deploying hybrid apps efficiently
Explain about the Measuring your mobile app's performance at different KP.

Key performance issues

There are many problems that can contribute to bad performance in an app, but the
following are some common issues to look for in your app:

14 Startup latency
Startup latency is the amount of time it takes between tapping on the app
icon, notification, or other entry point, and the user's data showing on the
screen.
Aim for the following startup goals in your apps:
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Cold start in less than 500ms. A cold start happens when the app being
launched isn't present in the system's memory. This happens when it is the
app's first launch since reboot or since the app process is stopped by either
the user or the system.
 P95 and P99 latencies very close to the median latency. When the app takes
a long time to start, it makes a poor user experience. Interprocess
communications (IPCs) and unnecessary I/O during the critical path of app
startup can experience lock contention and introduce inconsistencies.
Scroll jank
Jank is the term that describes the visual hiccup that occurs when the system
isn't able to build and provide frames in time to draw them to the screen at
the requested cadence of 60hz or higher.
Apps must target 90Hz refresh rates. Conventional rendering rates are 60Hz,
but many newer devices operate in 90Hz mode during user interactions,
such as scrolling. Some devices support even higher rates of up to 120Hz.
To see what refresh rate a device is using at a given time, enable an overlay
using Developer Options > Show refresh rate in the Debugging section.
Transitions that aren't smooth
This is apparent during interactions such as switching between tabs or
loading a new activity. These types of transitions must be smooth
animations and not include delays or visual flicker.
Power inefficiencies
Doing work reduces battery charge, and doing unnecessary work reduces
battery life.

Memory allocations, which come from creating new objects in code, can be
the cause of significant work in the system. This is because not only do the
allocations themselves require effort from the Android Runtime (ART), but
freeing these objects later (garbage collection) also requires time and effort.

Identify issues
We recommended the following workflow to identify and remedy performance
issues:

1. Identify and inspect the following critical user journeys:

 Common startup flows, including from launcher and notification.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Screens where the user scrolls through data.

 Transitions between screens.
 Long-running flows, like navigation or music playback.
2. Inspect what is happening during the preceding flows using the following
debugging tools:
 Perfetto: lets you see what is happening across the entire device with precise
timing data.
 Memory Profiler: lets you see what memory allocations are happening on the heap.
 Simpleperf: shows a flamegraph of what function calls are using the most CPU
during a certain period of time. When you identify something that's taking a long
time in Systrace, but you don't know why, Simpleperf can provide additional
information.
 Startup flows
 Field metrics: Play Console startup time
 Lab tests: test startup with Macrobenchmark
App Links verification issues
App Links are deep links based on your website URL that are verified to belong to
your website. The following are reasons that can cause App Link verifications to
fail.
 Intent filter scopes: only add autoVerify to intent filters for URLs that your app
can respond to.
 Unverified protocol switches: unverified server-side and subdomain redirects are
considered security risks and fail verification. They cause all autoVerify links to
fail. For example, redirecting links from HTTP to HTTPS, such as example.com to
www.example.com, without verifying the HTTPS links can cause fail verification.
Make sure to verify App Links by adding intent filters.
 Non-verifiable links: adding non-verifiable links for testing purposes can cause the
system to not verify App Links for you app.
 Unreliable servers: make sure your servers can connect to your client apps.

a Write down the steps in APP Performance and Explain each step briefly.

15 "App Performance" refers to the process of evaluating and optimizing an

application's speed, responsiveness, and overall user experience. The
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

key steps involved are:

1. Requirements Gathering:
 Identify Performance Goals:
Define specific metrics to measure performance, such as load times, frame
rates, memory usage, and network latency based on user needs and application
context.
 User Analysis:
Understand how users interact with the app to pinpoint potential performance
bottlenecks.
 Device Compatibility:
Consider the range of devices and operating systems the app will run on to
optimize for different hardware capabilities.
2. Performance Profiling and Analysis:
 Instrumentation:
Add logging and tracing code within the application to capture performance
data like function call times, resource usage, and network requests.
 Performance Monitoring Tools:
Utilize profiling tools provided by the development environment (e.g., Android
Studio, Xcode) to identify performance bottlenecks and hotspots.
 Benchmarking:
Run controlled tests under different scenarios to measure performance metrics
and identify areas for improvement.
3. Optimization Techniques:
 Code Optimization:
 Efficient Algorithms: Choose appropriate algorithms to minimize processing time.
 Memory Management: Properly allocate and deallocate memory to avoid leaks
and excessive usage.
 Lazy Loading: Load data only when needed to reduce initial loading times.
 UI Optimization:
 Image Optimization: Compress image sizes without compromising quality.
 Layout Optimization: Design efficient layouts to reduce rendering complexity.
 UI Thread Management: Ensure UI updates are handled on the main thread to
maintain responsiveness.
 Network Optimization:
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Caching: Store frequently accessed data locally to reduce network requests.

 Efficient API Calls: Design well-structured API calls to minimize data transfer.
 Data Compression: Compress data sent over the network.
4. Testing and Validation:
 Load Testing: Simulate high user loads to identify performance issues under
stress.
 Device Testing: Test the application on a variety of devices and network
conditions to ensure consistent performance.
 User Feedback: Gather feedback from real users to identify perceived
performance issues.
5. Continuous Improvement:
 Monitoring and Analysis:
Monitor application performance in production to identify emerging issues and
trends.
 Iterative Optimization:
Continuously refine optimization strategies based on monitoring data and user
feedback.

b Discuss in detail about debugging capabilities.

Debugging capabilities primarily refer to the tools and features provided within
the chosen IDE (Integrated Development Environment) that allow developers
to identify and fix errors (bugs) in their application code, enabling them to
systematically analyze program execution, step through code line by line,
inspect variable values, and pinpoint the root cause of issues during
development.
 Breakpoints:
 The ability to set breakpoints at specific lines of code, causing the program to pause
execution at that point, allowing the developer to examine variables and program state at
that juncture.
 Step-by-Step Execution (Stepping):
 Step Over: Executes the current line of code and moves to the next line, skipping any
function calls within it.
 Step Into: Enters a function call, allowing the developer to debug code within the function
step-by-step.
 Step Out: Exits the current function and returns to the calling code.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Watchpoints:
 Allows monitoring a specific variable, pausing execution when the variable's value
changes, useful for tracking dynamic data changes.
 Variable Inspection:
 Capability to examine the current values of variables at any point during execution,
providing insights into the data flow.
 Console Output:
 Printing debug messages to the console to track the progress of the application and identify
potential issues.
 Error Handling and Logging:
 Integrated mechanisms to catch exceptions and log errors, providing valuable information
about where and when issues occur.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

Department of Artificial Intelligence and Data Science

Academic Year 2024-2025 (Odd Semester)
Unit - IV
Sub.Code/Sub.Name : CCS332 – App Development Date :
Year/Sem. : III / V

Answer All the Questions

Part A (10x2=20 Marks)
List the two frameworks in cross platform Architecture?

Two popular frameworks commonly used in cross-platform architecture for app development
are React Native and Flutter; both allow developers to build applications for multiple platforms
using a single codebase, primarily utilizing JavaScript for development.
React Native:
Developed by Facebook, it leverages the React JavaScript library to create native-looking apps on
1. both Android and iOS, allowing developers to write components in JavaScript while potentially
using platform-specific languages like Swift or Java for certain functionalities.

Flutter:
An open-source framework by Google, Flutter uses Dart as its programming language and provides
a unique UI rendering engine that enables smooth performance across different platforms.

Give Examples for Cross-Platform Apps

Examples of cross-platform apps you could build using frameworks like React Native, Ionic, or Flutter
2.
include: a news aggregator app, a simple e-commerce platform, a to-do list app, a fitness tracker, a
social media feed viewer, a language translation tool, a basic portfolio website, or a mobile game with
simple mechanics.
How do you choose the right cross-platform app development framework for your project?

Consider factors like your project's complexity, required features, target audience, development team's
3.
skills, desired performance level, and the need for native-like UI, carefully evaluating frameworks like
Flutter, React Native, Xamarin, Ionic, and Cordova based on their strengths and weaknesses to find the
best fit for your specific needs.
List the Benefits of cross-platform development

1. Cost Efficiency: Developing a single codebase that works on multiple platforms

reduces development costs compared to creating separate apps for each platform.
4. 2. Time Savings: Writing code once and deploying it across various platforms savestime,
as developers don't need to rewrite the entire app for each platform.

3. Consistent User Experience: Cross-platform tools aim to provide a consistent look and
feel across different platforms, maintaining a unified user experience.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

4. Faster Development: Rapid development is possible due to code sharing and quicker
iterations, helping apps reach the market faster.

5. Easier Maintenance: Maintaining a single codebase simplifies updates and bug fixes,
reducing the complexity of managing multiple code repositories.

How to develop cross-platform mobile apps?

Primarily use a framework like React Native, Flutter, or Xamarin which allows you to write a
single codebase that can be compiled and run on both iOS and Android devices, essentially
"writing once, running everywhere."
Key steps involved:

1. Choose a Framework:

 React Native:
5. Based on JavaScript's React library, offering a large community and familiarity for web
developers.
 Flutter:
Developed by Google, uses Dart programming language, known for high performance and
smooth UI.
 Xamarin:
Utilizes C# and provides excellent native-like performance, particularly beneficial for
complex apps requiring strong platform integration.

List the tools creating Cross-platform App and programming languages support for it.

There are several popular tools and frameworks available for creating cross-platform apps.Here are
some of the most widely used ones:

1. React Native: Developed by Facebook, React Native uses JavaScript and React to build
cross-platform apps that render native components. It allows for efficient code reuse and
6. provides access to native device APIs.

2. Flutter: Created by Google, Flutter uses the Dart programming language to build apps with
a single codebase for iOS, Android, web, and desktop. It provides a rich set of
customizable UI widgets and has a strong focus on delivering a consistent and performant
experience.
3. Xamarin: Owned by Microsoft, Xamarin uses C# and .NET to build cross-platform apps. It
allows developers to share a significant amount of code while providing
Predict the future of cross-platform app development
7. 1. Corona SDK: Ideal for 2D game development, Corona SDK uses Lua programming
language and supports iOS, Android, and even desktop apps.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

Write the expression concatenate two names in JSX.

let line = <Line key={line.client_id} line={line}/>;

if(line.created_at) {
8. return <div className="date-line"><strong>{line.created_at}</strong></div> + line;
} else {
return chat_line;
}

Give the Name of Apps made with Xamarine cross-platform app framework

9. FreshDirect (online grocery delivery), UPS (package tracking app), Olo (restaurant delivery app), The
World Bank app, Alaska Airlines app, and Insightly CRM; all of which leverage the benefits of C#
coding to create native-like experiences across Android and iOS platforms.
What is the tool supported to develop a Facebook app ?

 App creation and management: Create new Facebook apps, manage settings like app name, platform
access, and user permissions.
 APIs: Access a wide range of Facebook APIs to interact with user data, posts, events, messaging, and
more.
10. Graph API: The core API for data retrieval and manipulation on Facebook.
 Authentication: Implement login with Facebook using OAuth to authenticate users.
 SDKs: Use Facebook SDKs for iOS, Android, and web to integrate Facebook features directly into
your app.
 Testing: Test your app functionality using the Facebook Developer tools and sandboxes.

Part B (5x16=80 Marks)

Illustrate the Criteria for creating Cross-platform App.

Creating a cross-platform app involves careful consideration of various factors to ensure a

successful and efficient development process. This article will delve into the key criteria that
developers should evaluate when embarking on a cross-platform app development journey.

1. Project Goals and Scope: Begin by defining the goals and scope of your app.
11 Understandthe target audience, app purpose, and core features. This clarity will guide
decisions throughout development.

2. Platform Support: Research the platforms you intend to support, such as iOS, Android,
andpotentially others like Windows or web browsers. Choose a framework that aligns with
your desired platform coverage.

3. Framework Selection: Evaluate cross-platform frameworks like React Native,

 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
Flutter,Xamarin, or others. Consider factors such as programming language,
performance, community support, and the ability to access native features.

4. User Experience and Design: Design a user-friendly interface that adapts well to
differentplatforms. Ensure consistent branding and usability across all devices.

5. Native Feature Access: Check whether the chosen framework allows access to
nativedevice features like camera, GPS, sensors, and notifications. This ensures a rich
user experience.

6. Performance: Performance is critical for user satisfaction. Assess how well the
frameworkoptimizes app speed and responsiveness on different devices.

7. Code Reusability: A primary advantage of cross-platform development is code reusability.

Evaluate how much code can be shared across platforms and how much needs to be
platform-specific.

8. Development Team Expertise: Consider the skills of your development team. If they
aremore proficient in certain languages or frameworks, that might influence your
decision.

9. Third-Party Library Support: Check if the framework supports essential third-

party libraries or tools that your app might need. These could include libraries for
analytics,payment processing, or networking.

10. Customization and Flexibility: Determine how much customization and flexibility the
chosen framework provides. Some frameworks might limit certain design or interaction
possibilities.

11. Testing and Debugging: Ensure the framework provides efficient testing and
debuggingtools for both the shared code and any platform-specific code.

Differentiate between Native vs Hybrid vs Cross-Platform.

"Native" means building an app specifically for one operating system (like iOS or
Android) using its dedicated programming languages, resulting in optimal performance
but requiring separate codebases for each platform; "Hybrid" uses web technologies like
HTML, CSS, and JavaScript wrapped in a native container to run on multiple platforms
12 with a single codebase, offering faster development
Key Differences:

 Platform Specificity:
 Native: Designed for a single platform, leveraging full access to device features and APIs.
 Hybrid: Primarily web-based, accessing native features through plugins, potentially with
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

performance limitations.
 Cross-Platform: Aims to create a native-like experience across multiple platforms using
shared code, often with some platform-specific adjustments.
 Development Process:
 Native: Requires separate codebases for each platform (e.g., Swift for iOS, Java for
Android).
 Hybrid: Uses web technologies within a native container, often requiring less code
maintenance.
 Cross-Platform: Uses a single codebase with platform-specific bridges to access native
features.
 Performance:
 Native: Generally provides the best performance due to direct access to device hardware and
APIs.
 Hybrid: May experience performance issues depending on the complexity of the app and the
native container.
 Cross-Platform: Can achieve near-native performance with proper optimization.

Native App Hybrid App Cross-Platform

Aspect
Development Development App Development

uses languages It utilises framework

particular to a given usually makes use of that allows
platform (e.g., web development in a
Development Language
Java/Kotlin for technology(HTML, single language (e.g.,
Android, Swift for CSS, Javascript) React Native,
iOS) Xamarin)

It generally offers Performance can

that performance as May have slightly vary but often
Performance apps are optimised slower performance due optimises for decent
for specific to web view rendering. performance across
platform. multiple platforms.

It strives to provide
It can provide the It may lack some native consistant user
best native user look and feel, but can experience across
User Experience
experience tailored achieve a native user platforms, may not
to each platforms. experience. fully match native
experience.

Development Time Longer development Faster development Faster development

 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

time because each time because a single time in compared to

platforms requires a codebase may be used native programming,
different codebase. on several platforms. but may require
plateform specific
tweak.

Requires maintaining
a single codebase,
Easier maintenance as
Requires different but may still need
Maintenance changes can be made to
codebases adjustments for
the single codebase
platform-specific
updates

Write down the steps to create simple Hello world App in Xamerin

First of all, start a new instance of Visual Studio and go to File → New → Project.

On the Menu dialog box that appears, go to Templates → Visual C# → Android → Blank App
(Android).

Give an appropriate name for your application. In our case, we name it “helloWorld” and save it in
the default location provided. Next, click the OK button for the new “helloXamarin” project to load.

On the solution, open Resources → layout → Main.axml file. Switch from Design View and go to
the Source file and type the following lines of code to build your app.

<?xml version = "1.0" encoding = "utf-8"?>

<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:background = "#d3d3d3"
13 android:layout_width = "fill_parent"
android:layout_height = "fill_parent">
<TextView
android:text = "@string/HelloXamarin"
android:textAppearance = "?android:attr/textAppearanceLarge"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/textView2"
android:textColor = "@android:color/black" />
</LinearLayout>

In the above code, we have created a new Android textview. Next, open the folder values and
double-click Strings.xml to open it. Here, we are going to store information and values about
the button created above.

<?xml version = "1.0" encoding = "utf-8"?>

<resources>
<string name = "HelloXamarin">Hello World, I am Xamarin!</string>
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
<string name = "ApplicationName">helloWorld</string>
</resources>

Open MainActivity.cs file and replace the existing code with the following lines of code.

using System;
using Android.App;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;

namespace HelloXamarin {
public class MainActivity : Activity {
protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
}
}
}

Save the application. Build and then run it to display the created app in an Android Emulator.

Explain the installation steps of React Native.

System Requirements:

 Node.js: Install a stable LTS version of Node.js from the official website.
 NPM (Node Package Manager): This comes bundled with Node.js and will be used to
install React Native CLI.
2. Installing React Native CLI:

 Open your terminal and run the following command to install the React Native CLI
globally:
14 Code
npm install -g react-native-cli
3. Setting up Android Development Environment (if needed):

 Android Studio: Download and install Android Studio from the official website.
 Java Development Kit (JDK): Ensure you have a compatible JDK installed.
 Android SDK: Set up the necessary Android SDKs through Android Studio.
4. Creating a New React Native Project:

 Navigate to your desired project directory in the terminal.

 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Run the following command to create a new React Native project, replacing "MyProject"
with your project name:
Code
npx react-native init MyProject
5. Accessing the Project:
Navigate into your new project directory.
Code
cd MyProject
6. Running the App (Android):
Start the development server.
Code
npx react-native start
 Launch emulator or connect a device: Open Android Studio, create an Android Virtual
Device (AVD) if needed, and start it.
 Run the app:
Code
npx react-native run-android
Important Considerations:

 iOS Development:
If you want to develop for iOS, you will also need to install Xcode and set up necessary
provisioning profiles.
 Expo Option:
For a quicker setup, consider using Expo which provides a streamlined way to develop
React Native apps with additional features.
 Code Editor:
Choose a code editor like Visual Studio Code to write your React Native code.

Discuss about the Flutter Architecture in detail.

The Flutter architecture mainly comprises of four components.

1. Flutter Engine
2. Foundation Library
3. Widgets
15 4. Design Specific Widgets

Flutter Engine
It is a portable runtime for high-quality mobile apps and primarily based on the C++ language. It
implements Flutter core libraries that include animation and graphics, file and network I/O,
plugin architecture, accessibility support, and a dart runtime for developing, compiling, and
running Flutter applications. It takes Google's open-source graphics library, Skia, to render low-
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
level graphics.

Foundation Library
It contains all the required packages for the basic building blocks of writing a Flutter application.
These libraries are written in Dart language.

Widgets
In Flutter, everything is a widget, which is the core concept of this framework. Widget in the
Flutter is basically a user interface component that affects and controls the view and interface of
the app. It represents an immutable description of part of the user interface and includes
graphics, text, shapes, and animations that are created using widgets. The widgets are similar to
the React components.

We can understand it from the hello world example created in the previous section. Here, we are
going to explain the example with the following diagram.

In the above example, we can see that all the components are widgets that contain child widgets.
Thus, the Flutter application is itself a widget.

Design Specific Widgets

The Flutter framework has two sets of widgets that conform to specific design languages. These
are Material Design for Android application and Cupertino Style for IOS application.

Gestures
It is a widget that provides interaction (how to listen for and respond to) in Flutter using
GestureDetector. GestureDector is an invisible widget, which includes tapping, dragging, and
scaling interaction of its child widget. We can also use other interactive features into the existing
widgets by composing with the GestureDetector widget.

State Management
Flutter widget maintains its state by using a special widget, StatefulWidget. It is always auto re-
rendered whenever its internal state is changed. The re-rendering is optimized by calculating the
distance between old and new widget UI and render only necessary things that are changes.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
Layers
Layers are an important concept of the Flutter framework, which are grouped into multiple
categories in terms of complexity and arranged in the top-down approach. The topmost layer is
the UI of the application, which is specific to the Android and iOS platforms.

The second topmost layer contains all the Flutter native widgets. The next layer is the rendering
layer, which renders everything in the Flutter app. Then, the layers go down to Gestures,
foundation library, engine, and finally, core platform-specific code.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

Department of Artificial Intelligence and Data Science

Academic Year 2024-2025 (Odd Semester)
Unit - V
Sub.Code/Sub.Name : CCS332 – App Development Date :
Year/Sem. : III / V

Answer All the Questions

Part A (10x2=20 Marks)
Compare React Native and Flutter.

1. Flutter generally offers superior performance and a more consistent cross-platform UI due to its
custom rendering engine, while React Native provides a wider developer base thanks to its reliance on
JavaScript
Define Flutter.

"Flutter" refers to an open-source UI framework created by Google that allows developers to build
2.
cross-platform mobile applications (for both iOS and Android) using a single codebase, essentially
meaning you can write one set of code to deploy on multiple mobile platforms, making app
development more efficient and streamlined;
Give real time App developed with Flutter?

3. Google Ads, Google Pay, eBay Motors, Philips Hue, the Hamilton Musical app, Cryptomaniac Pro,
Insight Timer, Grab, Realtor.com, and Baidu; all showcasing the capability to build cross-platform
applications with high-quality user experiences across Android and iOS devices.
List out the Mobile app performance KPIs to measure app quality

4. Active Users (DAU/MAU), Retention Rate, Session Length, Churn Rate, Conversion Rate, Average
Revenue Per User (ARPU), Cost Per Install (CPI), App Crash Rate, Load Time, User Satisfaction
Score, and Net Promoter Score (NPS);
Define Mobile Angular UI?
5.
Mobile Angular UI is a front-end framework that allows developers to build mobile web applications
using the AngularJS JavaScript framework and the Bootstrap CSS library
List the metrics of app performance.

6. Active users (DAU/MAU), session length, churn rate, retention rate, error rates, network latency,
conversion rate, download count, average revenue per user (ARPU), user satisfaction, application
availability, and cost per acquisition (CPA)
List the functional aspects of debugging capabilities.

Breakpoints setting, variable inspection, watchpoint monitoring, step-by-step execution, call stack
7.
analysis, memory examination, logging functionality, error breakpoints, conditional breakpoints, and
the ability to simulate device interactions to effectively identify and fix issues within the application
code while running on a simulated device environment
Compare UX vs UI designers.
8.
A UX designer focuses on the overall user experience by conducting research, creating user flows, and
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in
ensuring the app is intuitive and easy to navigate, while a UI designer takes those UX guidelines and
translates them into the visual elements of the interface, like color schemes, typography, and layout,
making the app visually appealing and user-friendly
What is Reusability in app framework ?

9. Reusability" refers to the ability to use pre-written code components, modules, or design patterns
across different parts of an application, reducing the need to write the same code multiple times, thus
saving development time and effort while promoting consistency across the app
Define easy development in app framework.

"Easy development" with an app framework refers to a development environment where building
10.
applications is simplified by providing pre-built components, readily available functions, and a user-
friendly interface, allowing developers to quickly create complex applications with minimal coding
effort, especially when compared to building from scratch

Part B (5x16=80 Marks)

a Differentiate Xamarin, React Native and Flutter framework.

with Xamarin using C#, React Native relying on JavaScript, and Flutter utilizing Dart, each
offering distinct advantages depending on the project needs and developer expertise; Xamarin
provides a more native-like experience by leveraging platform-specific UI controls, while React
Native bridges JavaScript with native components, and Flutter renders its own UI using a
custom rendering engine, leading to potentially faster performance and consistent look across
platforms.
Key Differences:

 Programming Language:
 Xamarin: C# (based on .NET framework)
 React Native: JavaScript

11  Flutter: Dart
 UI Rendering:
 Xamarin: Primarily uses native platform UI controls, offering a near-native look and feel
 React Native: Bridges JavaScript to native components, potentially leading to some
performance overhead
 Flutter: Renders its own UI using a custom rendering engine (Skia), resulting in consistent
appearance across platforms
 Performance:
 Xamarin: Can achieve good performance with native UI controls but may have some
platform-specific differences
 React Native: Performance can vary depending on the complexity of the app and the
JavaScript bridge
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Flutter: Generally considered to have superior performance due to its direct rendering
approach
Choosing the Right Framework:

 Xamarin:
Best suited for developers with strong C# experience, projects requiring a high degree of
native-like functionality, and integration with existing .NET codebases
 React Native:
Ideal for projects where rapid development is crucial, developers are familiar with
JavaScript, and a large community support is needed
 Flutter:
Well-suited for projects prioritizing smooth performance, consistent UI design across
platforms, and fast development cycles with hot reload feature

b Comparison of different App frameworks with Pros and cons.

 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

a Write down the steps to debug in android

 Enable Developer Options on your device:

12  Go to Settings > About Phone and tap "Build number" multiple times until "Developer
options" appear.
 Enable USB Debugging within Developer Options.
 Set up Android Studio:
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Ensure you have Android Studio installed and your project is open.
 Make sure your project is set to "Debug" mode in the build variant dropdown.
Debugging Process:

 Set Breakpoints:
 Navigate to your code in Android Studio.
 Click on the line number where you suspect an error might occur to set a breakpoint.
 Run in Debug Mode:
 Click the "Debug" button (green bug icon) in Android Studio.
 Your app will launch on the emulator or connected device, pausing execution at the first
breakpoint you set.
 Inspect Variables and State:
 While paused at a breakpoint:
 Hover over variables in the code to see their current values.
 Use the "Watch" window to monitor specific variables throughout execution.
 Examine the UI state using the "Layout Inspector" to see how views are arranged.
 Step Through Code:
 Use the debugging controls in Android Studio:
 Step Over: Execute the current line and move to the next (skips function calls).
 Step Into: Enter a function call to debug inside it.
 Step Out: Exit the current function and return to the calling code.
 Log Messages:
 Add Log.d("TAG", "Message") statements in your code to print debug information to the
Logcat window.
 Access Logcat in Android Studio to view the logs.
 Handle Exceptions:
 Set up exception breakpoints to pause execution when a specific exception is thrown.
 Examine the stack trace to identify the source of the error.
Advanced Debugging Techniques:

 Attach Debugger to Running Process:

 If your app is already running, you can attach the debugger to it by going to Run > Attach
debugger to Android process.
 Use the Android Monitor:
 Monitor network requests, CPU usage, memory allocation, and other performance metrics in
the Android Monitor tab.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Debug Layouts:
 Use the Layout Inspector to visually inspect your app's UI layout and identify layout issues.
Important Considerations:

 Test on Multiple Devices: Debug your app on a variety of devices and screen sizes to
ensure compatibility.
 Test Different Scenarios: Cover various user interactions and edge cases to identify
potential bugs.
 Review Code Regularly: Good coding practices and code reviews can help prevent bugs in
the first place.

b Explain the rules to design good UI and UX.

 User-centered design:
 User research: Conduct thorough user research to deeply understand user needs, pain points,
and behaviors to design specifically for them.
 User personas: Create fictional user profiles representing your target audience to guide design
decisions.
 Iterative testing: Continuously test designs with real users to gather feedback and refine the
interface.
 Simplicity and Clarity:
 Minimalist design: Avoid clutter by using only essential elements and visual hierarchy.
 Clear labeling: Ensure all buttons, fields, and interactive elements have clear and descriptive
labels.
 Cognitive load reduction: Design to minimize the amount of information users need to
process at once.
 Consistency:
 Visual language: Maintain consistent color schemes, fonts, iconography, and layout across
the entire app.
 Platform conventions: Follow platform design guidelines for the operating system (iOS,
Android) to ensure familiarity.
 Intuitive Navigation:
 Logical structure: Arrange content and features in a logical and predictable way.
 Clear navigation hierarchy: Use clear menus and breadcrumb trails to help users understand
their location within the app.
 Consistent interaction patterns: Use familiar interaction patterns like tap, swipe, and drag to
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

minimize learning curve.

 Accessibility:
 Color contrast: Ensure sufficient color contrast for users with visual impairments.
 Keyboard navigation: Allow users to navigate the interface entirely using the keyboard
 Alternative text: Provide descriptive text for images and icons for screen reader users

Explain ways to improve the app performance in detail.

Code Optimization:

 Clean Code Practices:

Write well-structured, commented code with clear logic to enhance readability and
maintainability, reducing potential performance bottlenecks.
 Efficient Algorithms and Data Structures:
Choose appropriate data structures (like arrays for sequential access, hash tables for
quick lookups) and algorithms based on the problem to minimize processing time.
 Avoid Unnecessary Calculations:
Calculate values only when needed, and reuse previously computed results where
possible to prevent redundant operations.
 Minimize Loops:
Optimize loop structures to reduce iterations and improve efficiency, especially when
13 dealing with large datasets.
Data Management:

 Lazy Loading:
Load data only when it's actually needed, especially for large lists or content that
might not be immediately visible to the user.
 Pagination:
Divide large datasets into smaller chunks to load data in manageable portions,
improving responsiveness.
 Data Caching:
Store frequently accessed data locally (in memory or on device storage) to reduce
server requests and improve loading times.
Image Optimization:

 Image Compression:
Reduce image file sizes without significant quality loss using appropriate compression
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

techniques like JPEG or WebP.

 Image Resizing:
Serve images at the appropriate size for the device screen to minimize unnecessary
data transfer.
 Image Lazy Loading:
Load images only when they come into view on the screen to improve initial load
times.
Network Optimization:

 Minimize Network Requests: Batch multiple API calls together to reduce the number
of HTTP requests.
 Use HTTP/2: Leverage HTTP/2 protocol for faster data transfer and improved
performance.
 Implement Offline Mode: Allow users to access essential data even with poor or no
internet connectivity.
Performance Monitoring and Analysis:

 Profiling Tools:
Utilize development tools to identify performance bottlenecks, including CPU usage,
memory leaks, and slow rendering operations.
 User Experience Monitoring:
Track metrics like loading times, frame rate, and app launch time to understand user
perception of performance.
Device Considerations:

 Device Compatibility:
Design and optimize the app for a range of devices with varying hardware capabilities
to ensure smooth performance across different screen sizes and processing power.
 Low-Power Modes:
Implement strategies to minimize battery usage when the device is in low-power
mode.

Discuss in detail about Reusability in App Frameworks

Code reusability is the capacity to repurpose pre-existing code when developing new software
14 applications. Ideally, code reuse should be easy to implement, and any stable, functional code
could freely be reused when building a new software application. Unfortunately, this is not the
case; It’s very important to ensure that the code being reused is appropriate and a good fit for
the software application.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

Pre-existing code can be recycled to perform the same function or repurposed to perform a
similar but slightly different function. Code reusability increases productivity reduces costs, and
improves overall quality. Reusability in software development is a highly popular and
productive practice.
Features that Code with a Potential for Reuse should have:

 Versatility which allows for the code to be easily adapted for another application.
 Compatibility with different hardware.
 It should be free of any bugs or defects that may affect the security or dependability of the other
application.

Types of Code Reuse

Code Reuse can be planned. Development teams can write software components with the vision
to reuse them in the future, or, on some occasions, developers may realize that they have code
from previous projects that can be reused by sheer coincidence.
There are two major types of code reuse:

1. Internal reuse – This is when code written internally by a developer team or business is
reused for other projects.
2. External reuse – This is when some third-party tool or code is licensed and employed
in a project. This can be tricky since costs will be involved, and time will be required to learn
and implement the tool. Additionally, it creates a dependency upon an external tool which may
lead to issues further down the line.

Describe the importance of application maintainability.

 Reduced Costs:
Well-maintained code is easier to modify, meaning less time and effort is spent
debugging and troubleshooting issues, leading to lower maintenance costs over the
application's lifecycle.
15  Faster Time to Market:
When updates are easier to implement, new features can be released quickly to
respond to market demands and user feedback.
 Improved Quality:
Consistent code quality, achieved through good coding practices and maintainability,
leads to fewer bugs and a more reliable application.
 M.A.M. SCHOOL OF ENGINEERING
Accredited by NAAC
Approved by AICTE, New Delhi; Affiliated to Anna University, Chennai
Siruganur, Trichy -621 105. www.mamse.in

 Enhanced Scalability:
A maintainable application is easier to adapt to future growth and changing user
needs, allowing for seamless scaling without major code overhauls.
 Team Collaboration:
Clear and organized code makes it easier for different developers to understand and
contribute to the project, promoting collaboration and knowledge sharing.
How to achieve good application maintainability in CCS332:
 Adhering to Coding Standards:
Following established coding guidelines ensures consistency and readability across
the codebase.
 Modular Design:
Breaking down the application into well-defined modules with clear responsibilities
simplifies maintenance and modification.
 Proper Documentation:
Thorough documentation explaining code functionality and design decisions
facilitates future understanding and updates.
 Unit Testing:
Writing comprehensive unit tests helps identify issues early and ensures code changes
don't introduce new bugs.
 Version Control:
Using a version control system allows tracking changes to the code, enabling easy
rollback to previous versions if needed.