Re: Single Page Applications -- WEB400

We are discussion two different application types here.

Kelly wants to replace his 5250 desktop applications while Nathan shows
list of mobile phones you typical will find in simple shop applications and
that seldom handle big datasets.

To compare Angular with EXT JS code here is a simple example on rendering a
grid with, in this example, a XML resource (Please notice that there are
column sorting and selection by just by pointing on the header and column
sequence can be rearranged and/or resized without any coding):

http://5.103.128.110:6380/wow05.html

PS. If you think there is a little delay it is actually because the XML
resource uses HTTPAPI to get a HTML page generated in WOW, extract the data
from the WOW demo page and converts it to XML. Who said a screen scraper
only applies to 5250 ;-)

http://apps.planetjavainc.com/wowBETA/runApp?id=0&_pj_lib=WOW_LINKED_IN

In a desktop application the server should deliver the XML/JSON object but
you do not load 10,000 rows for several reasons. The first reason is it
takes time to process/generate on the server. The second is it takes time
to transfer to the client. The third is it takes time to render.

The solution to big datasets is that the server only returns XML/JSON at a
given page/block size. In EXT JS we use Buffered Scrolling and Dynamic
Loading/Buffered Store. Buffered Scrolling is that only what is on the
screen is rendered. Dynamic Loading/Buffered Store is that you load big
datasets in blocks e.g. 100 rows per block. These techniques really speeds
things up and is done automatic and in parallel processes.

http://dev.sencha.com/extjs/5.1.0/examples/grid/buffer-grid.html

Another technique is that we use paging instead of scrolling where each
page is loaded from the server at paging time. This is the most used
technique I Business Applications because it is general bad design to both
have horizontal and vertical scrollbars at the same time on desktop grid
applications. This becomes even worse if the screen is small so the browser
also activates scrollbars.

Jon … “Mostly off-topic but "I would use SQL on the server to rebuild the
JSON array instead. “ - I wouldn’t. I build all lists of that nature in
memory for conventional subfiles. Problem with rebuilding is the data can
have changed - confuses the hell out a user who was looking for a specific
entry <grin>”

I happen to disagree. How can the user be confused by changes to data he
can’t see? Besides that how often do you press F5 in 5250 to refresh the
subfile with current data?

Another thing is that the server is much more efficient to do selections
and sorting that the client is since we have DB2 SQL and if you want a
total record count of the “Total View” the server is the place to do it on
especially if you only transfer datasets to the client in blocks.

On Wed, May 27, 2015 at 10:13 AM, Kevin Turner <
kevin.turner@xxxxxxxxxxxxxxxxxxxx> wrote:

I think you are suggesting that returning JSON data is not as safe and
efficient as returning the html itself. The latter is what you would be
doing in a traditional cgidev2 application, but we have dumped that method
(although it is still supported) in RNS 6.

You get a much more efficient process, and a much faster development time,
if you use the data model approach (basically the JSON) with two way
binding on the visual components. Now the developer can just arrange
components on the page and bind certain elements to data model properties.
The model gets exchanged between the client and the server, and the RPG
part of the process is now lightweight compared to some of the complicated
cgidev2 programs we used to have.

Our data grid component can do page by page loading, filtering, sorting on
huge files just as easily as a green screen subfile can.

On 27 May 2015, at 09:57, Bradley Stone <bvstone@xxxxxxxxx> wrote:

Kelly,

What I was getting at for scrolling or pagination is these examples use
static data sources.

Your application in "the real world" is going to return dynamic "results
sets" based on selection, sorting and page size that is being viewed.

Whether that data returned as JSON that is massaged into <li> containers
(or something else), or return those containers skipping the JSON part
these examples with static "finite" data sources are great for learning
concepts, but that's about it.

With JSON you have to parse that into <li> (or other) containers. If you
return dynamic <li> containers instead of JSON you get to skip a step of
client side processing removing a link of possible failure from the

chain.

Throw a little ajax in there for data retrieval and things aren't as

simple

as they look. But they sure are fun to program (even with RPG! Or in

your

case, COBOL). :)

There are just so many methods and options available there are literally

a

hundred ways to skin this cat.

Brad
www.bvstools.com

On Tue, May 26, 2015 at 5:31 PM, Kelly Cookson <KCookson@xxxxxxxxxxxx>
wrote:

I'm still learning about all of this, but I do think you can do infinite
scrolling with Angular and *not* without returning hundreds of

thousands of

records all at once. Here's something from IBM DeveloperWorks on the

topic:

https://www.ibm.com/developerworks/community/blogs/3d274f0f-f47a-4bf0-91ec-8ebad479881b/entry/how_to_implement_a_table_with_lazy_loading_infinite_scroll_in_angularjs?lang=en

Here are some other blogs and projects:

http://www.bimeanalytics.com/engineering-blog/infinite-scroll-with-angularjs-and-rails/

http://microblog.anthonyestebe.com/2014-01-11/infinite-scroll-with-angular/

http://lorenzofox3.github.io/lrInfiniteScroll/
http://binarymuse.github.io/ngInfiniteScroll/

I understand not everyone will want to learn and use a framework. That's
cool by me.

I don’t think a framework like Angular becomes as popular as it does by
being incredibly limiting, dysfunctional, and inefficient. There's
something in these frameworks that is attracting a lot of developers.

Thanks,
Kelly

-----Original Message-----
From: WEB400 [mailto:web400-bounces@xxxxxxxxxxxx] On Behalf Of Bradley
Stone
Sent: Tuesday, May 26, 2015 4:49 PM
To: Web Enabling the IBM i (AS/400 and iSeries)
Subject: Re: [WEB400] Single Page Applications

Pretty and functional is just the extra js/jQuery modules in the angular
demo. They both parse JSON data and present HTML that is massaged

again by

jQuery.

Now, do this with a hundred thousand records that could change or be
deleted, or new records added at any time. Does it still make sense to
build a huge JSON file from your database, load the entire thing and

allow

js do to pagination and sorting?

Or would it be better to allow your server application to do that,
requesting say 30 entries a page (or however many the user chooses) and
sorting/searching input each time?

Just food for thought. :)

Brad
www.bvstools.com

On Tue, May 26, 2015 at 4:10 PM, Jon Paris <jon.paris@xxxxxxxxxxxxxx>
wrote:

So how much difference was there in the “time to build”? The Angular
one is clearly prettier and more functional.

Jon Paris

www.partner400.com
www.SystemiDeveloper.com

On May 26, 2015, at 4:06 PM, Nathan Andelin <nandelin@xxxxxxxxx>

wrote:

Over the weekend I reviewed a couple Angular JS tutorials, one of
which steps through building an SPA which generates a list of smart

phones:

http://angular.github.io/angular-phonecat/step-12/app/#/phones

As part of my evaluation, I decided to mimic generating the phone
list, using the same JSON data source, but without using a framework:

http://www.radile.com:9220/rdweb/phones/index.html

I think it is a good idea to learn how to do things without a

framework.

It

will help you decide whether the lock-in is worth it.
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)
mailing

list

To post a message email: WEB400@xxxxxxxxxxxx To subscribe,
unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please take a
moment to review the archives at http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)

mailing

list
To post a message email: WEB400@xxxxxxxxxxxx
To subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives
at http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400) mailing
list
To post a message email: WEB400@xxxxxxxxxxxx
To subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives
at http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400) mailing
list
To post a message email: WEB400@xxxxxxxxxxxx
To subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives
at http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400) mailing

list

To post a message email: WEB400@xxxxxxxxxxxx
To subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives
at http://archive.midrange.com/web400.

___________________________________________
This email has been scanned by iomartcloud.
http://www.iomartcloud.com/

___________________________________________
This email has been scanned by iomartcloud.
http://www.iomartcloud.com/

________________________________

NOTICE: The information in this electronic mail transmission is intended
by CoralTree Systems Ltd for the use of the named individuals or entity to
which it is directed and may contain information that is privileged or
otherwise confidential. If you have received this electronic mail
transmission in error, please delete it from your system without copying or
forwarding it, and notify the sender of the error by reply email or by
telephone, so that the sender's address records can be corrected.

--------------------------------------------------------------------------------

CoralTree Systems Limited
Company Registration Number 5021022.
Registered Office:
12-14 Carlton Place
Southampton
Hampshire
SO15 2EA
VAT Registration Number 834 1020 74.
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400) mailing
list
To post a message email: WEB400@xxxxxxxxxxxx
To subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives
at http://archive.midrange.com/web400.