Best architectural approach for my asp.net mvc website

I want to create a product as website,Andriod app,IOS app and Windows app. To create website I want to develop with asp.net mvc,angular js and database in Neo4j(graph database). Below are the architectural approaches to develop the website

1. Direct interaction with database:

MVC controller ---> Service ---> database (Neo4j)

Eg: to display user details in the user/details

usercontroller -> details action ---> [in details action]userService.getUserDetails(id) ---> [in userService] execute query to get user details from neo4j database (Using Neo4jClient rest API will connect to database)

2. using repositories in data access layer MVC controller ---> Service ---> Repository ---> database (Neo4j)

3.using WEB API without repository MVC controller ---> Service ---> WEB API call ---> database (Neo4j)

4.using WEB API with repository MVC controller ---> Service ---> Repository(userRepository) ---> WEB API call ---> database (Neo4j)

For Mobile apps I want to develop a hybrid mobile application using some javascript libraries like KnockoutMobileUI/IonicJS and using API calls will get the data.

And now my questions are...

1. What is the best architectural approach which gives more performance,organized way without code duplication for web and mobile projects.


2. If Web API is the best option as we want to use it for both web and mobile projects.If Web API hosted in the same system, as the project in web solution mvc controller can directly access the web api methods to get the data(through dll). if it is hosted in other system mvc controller needs to use HttpClient or RestClient with API url to get the data. So which is better option to get the data using Web API?